javascript — один файл JS для нескольких страниц

Один файл JS для нескольких страниц

Ваш вопрос спрашивает, как загружать только фрагменты ваших сценариев на основе определенной страницы. Однако, поскольку ваша заявленная цель заключается в минимизации http-запросов (и трафика, я полагаю), я думаю, что моя уникальная (сложная) реализация, по крайней мере, имеет отношение к этому вопросу, если не является хорошей альтернативой / дополнением к вашему подходу.

Я использую это во встроенном приложении, где я объединяю все файлы javascript в один большой для уменьшения http-запросов. Я должен был также определить метод кэширования. Файл javascript размером 120 КБ в дополнение к нескольким изображениям приличного размера загружается при использовании базового веб-сервера 50 КБ.

Прежде всего, я использую YUI Compressor для сжатия моих файлов JavaScript, так как это простой способ сэкономить пропускную способность.

Крутая «функция», которую я обнаружил, заключалась в том, что если вы ссылаетесь на что-либо (css, js, img), например, следующее, вы просто загрузите файл и проигнорируете параметры после символа «?». в ‘src’:

{amp}lt;script type="text/Javascript" src="js/all.js?2382a97f099f42cc43c1b616cd24f281"{amp}gt;{amp}lt;/script{amp}gt; 

Теперь этот, казалось бы, случайный беспорядок чисел и букв на самом деле является контрольной суммой md5 файла javascript! Затем я изменил заголовок ответа моего сервера для соответствующих расширений (css, js, img и т. Д.), Чтобы он никогда не истек. Этот заголовок не отправляется для HTML-файлов, так как мы всегда хотим, чтобы последние версии тех.

 Cache-Control:max-age=290304000 

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

Я на самом деле компилирую мои файлы html / js / css / image с помощью кода C, поэтому у меня есть скрипт perl, который автоматически вставляет эти контрольные суммы md5 в файлы html перед компиляцией. Это, очевидно, не будет работать в вашем случае, но вы можете использовать любое количество способов справиться с этим, если у вас есть язык на стороне сервера, чтобы помочь вам. Например, вы можете сделать так, чтобы php вычислял контрольную сумму на лету, или вы можете сделать так, чтобы php сохранял контрольные суммы в базе данных или в простом файле, чтобы легко их искать. Чтобы пометить php для пересчета контрольной суммы, вы можете проверить время файла или удалить записи базы данных / плоский файл.

Я понимаю, что это большая предварительная работа, и она может быть не той, к которой вы стремитесь, но она прекрасно работает для меня. Прирост производительности для меня невероятен. Загрузка первой страницы очень медленная (8,5 секунд), но после этого все ваши скрипты, CSS и изображения теперь все кешируются. Загрузка новой страницы в том же приложении падает до ~ 300 мс.

Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector