Webpack捆綁如何減少流行庫（如React）的重複下載？

Question

我的理解是，Webpack會將你所有的代碼及其依賴的庫（如React）捆綁到一個js文件中。然後，當有人訪問您的網站時，他們會下載這個包含所有內容的包，然後運行它。這是否意味着，即使訪問者訪問過之前在React上運行過的其他站點，他仍然會下載包含React的軟件包並運行它？那不是因爲那個用戶已經有React而導致不必要的下載？

Answer 1

Webpack的其中一個用途是將所有代碼捆綁在一個文件中，以減少下載時間。在http中，對大文件的請求比對小文件的數十個請求要高效得多。

回答你的第一個問題：是的，導航到另一個反應應用程序的用戶總是必須下載你的腳本。

而對於你的第二個問題：不，它不會造成不必要的下載。有很多東西使得你的包是獨一無二的，在不同領域的應用之間實現一個緩存會非常困難（而且非常不安全）。想象一下其反應代碼中含有惡意代碼的網站。您不希望瀏覽器在您自己的應用程序中重複使用此代碼。

但是，爲了提高性能，您可以使用瀏覽器緩存在客戶端PC下載時將其保存在客戶端計算機中。多虧了這一點，他們每次訪問您的應用程序時都不需要下載腳本，只有當套件過期或更改時纔會下載。

也許this link可以幫助您瞭解如何添加捕捉到您的webpack構建。