Перейти до вмісту

Скоротила пакунок стилів із 87 КБ до 31 КБ, вийнявши з нього шрифт у base64, і позбулася 756 КБ у 22 файлах, які публікувалися під час кожного розгортання і на які ніщо не посилалося.

31 KB стилів — замість 87

Ситуація. Пакет таблиць стилів сайту важив 87 КБ, а для сайту з документами, який не використовує фреймворк, це більша частина ваги сторінки, витрачена ще до того, як надійде хоч якийсь вміст. Крім того, під час кожного розгортання сайт публікував каталог піктограм, згенерований один раз, на який відтоді ніщо не посилалося.

Завдання. Вагу треба було зменшити, не змінюючи дизайну, і зменшити з конкретної причини, на яку можна вказати, а не завдяки загальному наведенню ладу.

Дія. Спершу — вимірювання. Дві третини найбільшої таблиці стилів займав один шрифт, закодований у base64, — приблизно 56 КБ тексту, що кодували приблизно 42 КБ шрифту. Його вбудували заради швидшого першого відмальовування, яке попередньо завантажений зовнішній файл забезпечує й так, а платили за нього на кожній сторінці, незалежно від того, чи потрібна там ця вага. Після його вилучення цей файл зменшився з 84 КБ до 28, а весь пакет — з 87 до 31. Натомість три варіанти насиченості шрифту тепер попередньо завантажуються, причому третій додали до переліку лише тоді, коли дані реального використання показали, що саме він завершує найдовший критичний ланцюжок, а не тому, що три варіанти здавалися повним набором. Окремо аудит того, що насправді публікувалося під час розгортання, виявив двадцять одну згенеровану піктограму та дублікат файлу конфігурації — 756 КБ, які щоразу потрапляли на сервер, хоча ніщо на них не посилалося; а сам файл піктограми сайту зменшився з 145 КБ до 15. Для фірмового знака оцінили сучасний формат зображень, виміряли й відмовилися від нього: файл вийшов більшим, а механізм вибору бере варіант за порядком, а не за розміром, тож сучасний браузер усюди завантажував би важчий файл. Тепер дві перевірки не дають ситуації погіршитися: жодну фотографію не можна показувати ширшою за половину її вихідної ширини в пікселях, а кожну ілюстрацію треба публікувати в розмірі, який забезпечують її власні пікселі як за звичайної, так і за високої щільності.

Результат. Пакет важить 31 КБ замість 87, 756 КБ непотрібних ресурсів більше не розгортаються, і за кожним рішенням стоїть вимірювання — зокрема й за тим, що закінчилося відмовою; із двох видів записів саме такий корисніший.

Одна частина довшого переліку — і він увесь на цьому сайті.

Кожен запис написано однаково: ситуація, завдання, що ми зробили і що змінилося.

Переглянути весь перелік