Моя главная цель — загрузить несколько страниц как можно быстрее. Для этого я хочу воспользоваться как кешем, так и одной «специальной техникой», которая в качестве запасного варианта опирается на стандартный кеш.
Структура
На бэкэнде у меня есть следующая структура. В public_html есть главная страница и несколько подстраниц, каждая из которых имеет определенные правила css, отличающиеся друг от друга. Создание всех свернутых файлов выполняется с помощью скрипта, так что особой сложности здесь нет. Для простоты предположим, что это структура, хотя она и сложнее:
/public_html
/index.php
/style.css ~50kb
/min.css ~100kb
/subjects
/index.php
/style.css ~20kb
/min.css ~10kb
/books
/index.php
/style.css ~20kb
/min.css ~10kb
...
Первый запрос
Итак, когда пользователь впервые заходит на подстраницу, он получит этот html-код:
<!DOCTYPE html>
<html>
<head>
<link href="/subjects/min.css" rel="stylesheet" type="text/css">
</head>
<body>
All the body here
<link href="/min.css" rel="stylesheet" type="text/css">
</body>
Как видите, пользователь загружает весь CSS-код, необходимый для этой страницы, в шапку в небольшом файле. Обратите внимание, что /subjects/min.css НАМНОГО меньше, чем /min.css, что ускорит загрузку первого запроса. Затем, после полной загрузки html и css, начнется загрузка /min.css. Этот файл содержит все стили подстраниц.
Обратите внимание, что уместно поместить <link> в тег <body>, и даже если это не сработает, проблем нет, поскольку стиль страницы уже загружен. Почему я загружаю это здесь? Продолжай читать:
Следующие запросы
Для второго и последующих запросов в этом сеансе пользователь получит этот HTML-код:
<!DOCTYPE html>
<html>
<head>
<link href="/min.css" rel="stylesheet" type="text/css">
</head>
<body>
All the body here
</body>
/min.css уже должен быть кэширован с первого запроса. Однако, если по какой-либо причине это не так, теперь будет загружаться полностью свернутый стиль, как на любом обычном веб-сайте. Это будет запасной вариант.
Это действующая схема? Почему я не видел ничего подобного раньше? Содержит ли это какую-либо логическую ошибку?
Вот основные проблемы, которые я вижу, недостаточно сильные по сравнению с преимуществами:
- Это добавляет дополнительную сложность коду.
- Дополнительный запрос после того, как все уже загружено, необходимо сделать. Это добавит небольшую нагрузку на сервер, однако это статический файл.
Примечания к комментариям:
Браузер будет делать меньше запросов. Это правда, таким образом браузер делает один дополнительный запрос. Однако это после загрузки html и css, так что это не сильно повлияет на html.
Кэш. Да, я делаю все возможное, чтобы поймать файл. Однако можно было бы возразить против кеша
<link>, если он находится внутри<body>, потому что я не знаю, ведет ли он себя по-другому в отношении кеша, я только предположил, что да в вопросе.
