Створення спільного розповсюдженого запису

Дата оновлення перекладу 2023-06-22

Створення спільного розповсюдженого запису

Уявіть, що у вас є кілька файлів записів і кожен вимагає jquery. У цьому випадку, кожний файл виведення буде містити jQuery, сповільнюючи роботу вашого користувача. У цьому випадку, ви можете витягти ці загальні бібліотеки в "спільний" файл запису, який включається в кожну сторінку:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
Encore
    // ...
    .addEntry('page1', 'assets/js/page1.js')
    .addEntry('page2', 'assets/js/page2.js')

    // створює файл 'vendor.js' з jquery та модулем bootstrap JS
    // ці модулі більше *не* будуть включені в page1.js або page2.js
    .createSharedEntry('vendor', [
        'jquery',
        'bootstrap',

        // ви також можете вилучити CSS - це створить файл 'vendor.css'
        // цей CSS більше *не* буде вкючений в page1.css або page2.css
        'bootstrap-sass/assets/stylesheets/_bootstrap.scss'
    ])

Щойно ви зробите цю зміну, вам потрібно включити два додаткові файли JavaScript на вашій сторінці до будь-якого іншого файлу JavaScript:

1
2
3
4
5
6
7
8
9
<!-- ці два файли мають бути включені в кожну сторінку -->
<script src="{{ asset('build/manifest.js') }}"></script>
<script src="{{ asset('build/vendor.js') }}"></script>

<!-- тут ви посилаєтеся на певні JS-файли, необхідні поточній сторінці -->
<script src="{{ asset('build/app.js') }}"></script>

<!-- якщо ви вилучили якийсь CSS, включіть vendor.css -->
<link rel="stylesheet" href="{{ asset('build/vendor.css') }}" />

Файл vendor.js містить весь спільний код, який був витягнутий з інших файлів, тож очевидно, що він має бути включений. Інший файл (manifest.js), менш очевидний; він необхідний для того, щоб Webpack знав, як завантажувати ці загальні модулі.

Tip

Файл vendor.js найкраще працює, коли його зміст змінюється рідко і коли ви використовуєте довгострокове кешування . Чому? Якщо vendor.js містить код програми, який змінюється регулярно, то (при використанні версіонування), хеш його імені файлу буде регулярно змінюватися. Це означає, що ваші користувачі не будуть користуватися перевагами довгострокового кешування для цього файлу (який зазвичай досить великий).