Это зависит от того, что вы хотите. Вы собираетесь на скорость страницы?
Если вы хотите оптимизировать свой веб-сайт для увеличения скорости страницы, я рекомендую объединить файлы CSS и JavaScript в отдельные файлы (есть инструменты для автоматизировать этот процесс). Кроме того, если вы действительно хотите оптимизировать свой веб-сайт для скорости загрузки страниц, вы можете динамически применять комбинацию CSS и JavaScript, поместив следующий фрагмент непосредственно перед закрывающим тегом body
, чтобы HTML-код можно было отобразить перед выполнением Javascript:
<script type="text/javascript">
function (sources) {
for (var i = 0; i < sources.length; i++) {
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = sources[i];
head.appendChild(script);
}
})([
'//domain.com/combined.js'
]);
</script>
Обратите внимание, что файлы JavaScript не загружаются в синхронизированном порядке, но при использовании одного комбинированного сценария это не имеет значения.
Для листов я использую следующий алгоритм:
Определите, является ли это первым просмотром страницы сеанса: если да, вставьте комбинированный CSS в тег head
:
<html>
<head>
<style><? echo file_get_contens('./path_to_combined_style.css'); ?></style>
</head>
</html>
Если нет, просто включите ссылку CSS в тег head
:
<html>
<head>
<link rel="stylesheet" href="//domain.com/path-to-combined-style.css" type="text/css" />
</head>
</html>
Затем вы можете принудительно кэшировать стиль CSS при первой загрузке, выполнив XMLHttpRequest
, для простоты я использую jQuery
здесь:
$(document).ready(function(){
var href = "//domain.com/path-to-combined-style.css";
$link = $("link[href='" + href + "']");
if ($link.size() === 0) {
$.get(href);
}
});
Вы можете поместить это в комбинированный JavaScript.
Обратите внимание, что вы не сможете использовать преимущества скорости CDN. Чтобы решить эту проблему, вы можете опубликовать свои объединенные ресурсы в свой собственный CDN. Однако вы потеряете возможность того, что пользователь уже кэшировал загрузочную загрузку.
Конечно, весь этот процесс требует определенных знаний и опыта, поэтому вы можете рассмотреть возможность использования такого инструмента, как CloudFlare, который делает довольно хорошую работу по оптимизации вашего сайта.
person
Tim
schedule
12.01.2015