Boor & Tablet
Tablet
Привет, неумеха. Я тут разрываюсь между идеальным дизайном и чтобы на старых устройствах все быстро работало – как ты обычно находишь баланс, когда разрабатываешь что-то, что должно работать везде?
Boor
Сначала проверь на самом слабом компьютере. Делай интерфейс простым, используй векторные иконки или маленькие PNG-файлы, сжимай CSS и JavaScript, лениво загружай тяжёлые элементы и используй медиа-запросы, чтобы убрать излишние эффекты на слабых устройствах. Если анимация тормозит – выкинь её. Создавай для базовой конфигурации, а полировку добавляй только если есть запас по производительности.
Tablet
Звучит убедительно, Бор, но я всё равно проведу полный аудит исходных данных и буду отслеживать каждый мегабайт. Если что-то покажется неладным, я уберу эту лишнюю "блестючку".
Boor
Проверь и оптимизируй, убирай всё, что тормозит. Пусть интерфейс будет лаконичным, а производительность определяет детали.
Tablet
Поняла, Борь. Сначала пробегу быструю проверку, отмечу все замедления на 100 байт, подправлю раздутые ресурсы, а потом ещё раз всё измерю. Если какая-то функция вызывает задержку в 10 миллисекунд – либо выкидываю, либо переписываю её так, чтобы она работала только на CSS. А потом и доведём до ума, если запас производительности останется выше 95 процентов.
Boor
Отлично. Придерживайся цифр, не увлекайся излишествами. Если какая-то функция тормозит работу, либо убирай её, либо делай на CSS. Так будет быстрее и плавнее.
Tablet
Звучит идеально, Борь. Сначала проверю цифры, уберу всё лишнее, потом оставлю только CSS-штрихи, где получится — никаких вычурных трюков, чтобы не тормозило. Быстрый кусочек для ленивой загрузки:
```css
.lazy-img{
opacity:0;
transition:opacity .3s ease-in-out;
}
.lazy-img.loaded{opacity:1;}
```
Это всё сделает работу шустрой.
Boor
Отлично. Добавь `loading="lazy"` к тегам `<img>` тоже, и всё будет в порядке.
Tablet
Отличная идея, Борь. Добавление `loading="lazy"` заставит картинки подгружаться только когда они появятся в поле зрения, и страница будет загружаться быстрее. Никаких лишних затрат.
Boor
Отлично. Без лишних слов, быстро.
Tablet
Поняла, Борь—чистый код, минимум интерфейса, быстрая загрузка. Буду придерживаться этого принципа.
Boor
Хорошо. Не отступай.
Tablet
Конечно. Код будет лаконичный, без лишних заморочек. Сделаю всё чётко и быстро.