Манифест

В типичном приложении или сайте, созданном с помощью webpack, существует три основных типа кода:

1. Исходный код, написанный вами и, возможно, вашей командой.
2. Любой сторонний код библиотеки или «вендорский» код, от которого зависит ваш исходный код.
3. Выполняемый код webpack и манифест, обеспечивающие взаимодействие всех модулей.

Эта статья будет сосредоточена на последней из этих трех частей: выполняемом коде и, в частности, манифесте.

Выполняемый код

Выполняемый код, вместе с данными манифеста, — это по сути весь код webpack, необходимый для подключения вашего модульного приложения во время его работы в браузере. Он содержит логику загрузки и разрешения, необходимую для подключения ваших модулей по мере их взаимодействия. Это включает подключение модулей, которые уже загружены в браузер, а также логику для ленивой загрузки тех, которые еще не загружены.

Манифест

Как только ваше приложение попадет в браузер в виде index.html файла, некоторые сборки и различные другие активы, необходимые вашему приложению, должны быть загружены и каким-то образом связаны. Этот /src каталог, который вы тщательно подготовили, теперь скомпилирован, сжат и, возможно, даже разделен на более мелкие фрагменты для ленивой загрузки благодаря optimization webpack. Итак, как webpack управляет взаимодействием между всеми необходимыми модулями? Здесь вступают в игру данные манифеста...

По мере того, как компилятор входит, разрешает и отображает ваше приложение, он сохраняет подробные записи обо всех ваших модулях. Эта коллекция данных называется «Манифестом», и она используется выполняемым кодом для разрешения и загрузки модулей после того, как они были скомпилированы и отправлены в браузер. Независимо от выбранного вами синтаксиса модуля, эти import или require утверждения теперь стали __webpack_require__ методами, которые указывают на идентификаторы модулей. Используя данные в манифесте, выполняемый код сможет определить, где получить модули, стоящие за идентификаторами.

Проблема

Теперь вы немного знаете о том, как webpack работает в фоновом режиме. «Но как это на меня влияет?», — спросите вы. Простой ответ — в большинстве случаев нет. Выполняемый код, используя манифест, сделает свою работу, и все будет работать как по волшебству, как только ваше приложение окажется в браузере. Однако, если вы решите улучшить производительность своих проектов, используя кэширование браузера, этот процесс внезапно станет важным для понимания.

Используя хэши содержимого в именах файлов сборки, вы можете указать браузеру, когда содержимое файла изменилось, тем самым аннулируя кэш. Однако как только вы начнете это делать, вы сразу заметите некоторое странное поведение. Некоторые хэши меняются даже тогда, когда их содержимое, по-видимому, не меняется. Это вызвано введением выполняемого кода и манифеста, которые изменяются при каждой сборке.

См. раздел манифеста в нашем руководстве «Управление выводом» для получения информации о том, как извлечь манифест, а также ознакомьтесь с руководствами ниже, чтобы узнать больше об ухищрениях долгосрочного кэширования.