基於關鍵的優化（kbo）和shouldComponentUpdate（scu）如何與相互關聯？Keys vs shouldComponentUpdate，它們是如何關聯的，它們是不是一樣？
他們似乎在做同樣的事情（避免重新渲染和差異）。
它們有什麼不同？我錯過了什麼嗎？
我的感覺是scu被「包含」在基於密鑰的優化中，即。如果一個節點具有與之前渲染相同的密鑰 - 在樹的相同路徑上 - 那麼它將不會被重新渲染，並且這也可以通過kbo實現，但我不確定。
如果一個節點的路徑與先前渲染的路徑不匹配，scu返回false，那麼該節點會被重新渲染，會發生什麼？我的猜測是肯定的，但不知道。
它們絕對不一樣。
shouldComponentUpdate控制是否應該運行render，即是否需要DOM diff和update。此檢查通常發生在props,state或context發生更改時。
鑰匙是非常不同的。通過使用相同的key，確保使用相同的組件實例。考慮以下幾點：
<MyComponent title="Title 1" />
<MyComponent title="Title 2" />
如果由於某種原因，你的render刪除第一個組件和你結束了：
<MyComponent title="Title 2" />
那麼什麼情況是，第二部分是從DOM和刪除第一個獲得不同的屬性，導致重新渲染和DOM更新。
如果你正確使用鍵：
<MyComponent key="key1" title="Title 1" />
<MyComponent key="key2" title="Title 2" />
除去第一部分後，第二個會收到同樣的道具（將視其shouldComponentUpdate重新描繪），但最有可能是唯一的DOM更新是去除第一個組件。
感謝key，React可以做一個最小的DOM更新。
使用非託管的組件時，這有一些嚴重的影響，例如：
const MyComponent =() => {
return <input defaultValue="some-text" />;
};
同樣，當我們有
<MyComponent title="Title 1" />
<MyComponent title="Title 2" />
和你寫的一些文字到第一部分的input，和那麼你刪除了該組件，那麼即使它是包含它的第二個組件，文本也會保留在<input>中。鍵可以防止這種情況。
另請注意，當將key設置爲以前未呈現的內容時，例如，：
<MyComponent key="key3" />
的MyComponent一個新的實例被創建，調用componentDidMount。 這可用於完全重置組件的狀態（例如，用於非託管輸入）。
大多數情況下，您只需要在列表中使用key，以便在排序，刪除等時提供性能提升。它具有非託管輸入的一些次要用途，但僅此而已。
爲了與shouldComponentUpdate進行比較，基於關鍵字的優化有助於將當前渲染狀態與前一個進行匹配，從而防止改變道具。