Highload 23/01/2021

Cache-control с динамикой

Заголовок Cache-control позволяет значительно увеличить скорость загрузки сайта, а также разгрузить канал между сервером и пользователем. Этот заголовок включает кэширование и просто в применении для файлов, которые никогда не меняются. Но для того, чтобы использовать это преимущество для файлов, которые могут меняться, нужно детальнее разобраться в клиентском кэшировании:

1. Сервер отправляет дополнительный заголовок Cache-control

1. Браузер видит этот заголовок и сохраняет файл в свой кэш

1. При следующем запросе к файлу (например, посетитель перешел на другую страницу, а на ней опять есть загрузка библиотеки jQuery), который лежит в кэше, браузер не будет отправлять запрос на сайт. Он покажет сохраненную локально версию

1. Повторный запрос на сайт для загрузки закэшированных файлов браузер начнет слать только тогда, когда наступит дата, указанная в самом заголовке Cache-control (ее можно конфигурировать)

Включаем кэширование

Первое – нам необходимо включить кэширование для JS/CSS на сервере (у нас Nginx):
server {


                    
                        
                            Курс UX/UI дизайнер
сайтів і застосунків
з Alice K.
                            Курс від практикуючої UI/UX дизайнерки, після якого ви знатимете все про UI/UX дизайн .
                            Реєстрація на курс
                        
                    
...
location ~* ^.+.(js|css)$ {
expires max;
}
...
}

Использование версий

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


                    
                        
                            Онлайн-курс "Бренд-менеджмент" від Laba.
                            Розберіться в комплексному управлінні брендом: від його структури до комунікації з аудиторією.Дізнайтесь принципи побудови бренд-стратегії, проведення досліджень і пошуку свого споживача.
                            Детальніше про курс