Javascript и CSS в заголовке против отдельного документа?

Мне просто любопытно, есть ли какое-либо преимущество в использовании (минимизированной версии) javascript и css в заголовке с тегами script и style по сравнению с включением их из отдельного документа через ссылку на css и сценарий на javascript?

Разве теоретически не добавлено время загрузки страницы вторым способом, поскольку будут дополнительные запросы страницы?

так вот:

<head>

    <script>
        //Javascript
    </script>
    <style>
        //Css
    </style>

</head>

<body>
    //Content Here
</body>

</html>

Против этого:

<head>

    <script src='http://someJavascript.com/link/to/file.js' type='text/javascript'></script>
    <link href='http://someCSS.com/link/to/file.css' rel='stylesheet'>

</head>

<body>
    //Content Here
</body>

</html>

3 ответа

Решение

Преимущество в основном модульность. Если вы используете один и тот же JS или CSS в нескольких файлах, лучше хранить их в одном месте. Таким образом, если вы вносите в них изменения, вам не нужно обновлять все файлы, вы просто обновляете их в одном месте.

Но если JS или CSS относятся к конкретному файлу, вы можете также поместить их непосредственно в файл, а не форсировать отдельный запрос.

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

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

Другие вопросы по тегам