Ссылка

Вадим Макеев рассказывает не про доступность в докладе "Делайте из слона муху".

Наши веб-приложения тяжелые, медленные и часто неоптимальные. Хороший доклад о том, как и зачем оптимизировать интерфейсную графику.

#производительность

​​Современный веб пронизан фреймворками. Это не плохо! Проекты запускается быстро, а поддерживать их легко. Но иногда стоит избегать использования сторонних решений.

Проникся этой идеей и переписал свой сайт с Next.js (обвязка вокруг React) на чистый JS/CSS/HTML. Стало быстро, очень быстро. Новый сайт задизайнил Дима Журавлев.

Мой опыт — Как сделать сайт легким и быстрым без проблем

#производительность

Вебпак

Я не умею конфигурировать Вебпак. И потому всегда с удовольствием смотрю доклады и читаю статьи о том как этому научиться.

Крутой доклад "Вебпак, вид сквозь монокль" про оптимизацию билда, DX и, внезапно, функциональные линзы для управления конфигами.

#производительность

​​Svelte

Последнее время меня все больше занимает скорость работы сайтов. Я переписал свой сайт, чтобы он стал быстрым. И внимательно смотрю на альтернативные решения в мире фронтенд-фреймворков.

Пару недель назад познакомился со Svelte. Это простой фреймворк для построения реактивных интерфейсов, который имеет очень маленький (иногда даже нулевой) рантайм. И это поразительно. Кроме этого, Svelte работает быстро. Я не сравнивал его с другими фреймворками, но он быстр достаточно, чтобы этого не замечать.

В Svelte я встретил две проблемы, которые мне сильно мешают:
+ Отсутствие поддержки TypeScript. Я люблю статическую типизацию, без нее мне тяжело писать код.
+ Тулинг. Редакторы кода сейчас не слишком хорошо умеют общаться с Svelte, да и привычные инструменты (Prettier, ESLint) не слишком приветливы в этому фреймворку.

Авторы обещают в следующей версии добавить нормальную поддержку TS, а тулинг подтянется с популярностью. Попробуйте этот фреймворк на маленьком пет-проекте, он классный,

#фронтенд #производительность

Веб-воркеры

Все больше логики переносится на клиент. Но основной поток браузера слишком ценный, чтобы проводить в нем какие-то расчеты. Нужно выносить логику в другие потоки, в браузере для этого используются веб-воркеры.

Это простая технология, которая поддерживается почти всеми браузерами (даже ie11).

Хорошая вводная лекция на тему — Как построить дом, если ты — веб-воркер

#фронтенд #производительность

​​WASM

Вчера публиковал пост о веб-воркерах. Вторая технология, важная для производительности фронтенда — WebAssembly. Это такой способ выполнять не-JS код в браузере. Со всеми вытекающими — можно проводить сложные вычисления на Rust, и строить графики на Python.

Этот подход тоже не лишен недостатков — wasm-файлы довольно тяжелые, ваше приложение будет медленно загружаться, зато быстро работать.

13 июня в 20-00 МСК OTUS проводит открытый урок "WebAssembly". Там подробно расскажут о WebAssemby, принципах его работы и кейсах применения.

#фронтенд #производительность #партнерский_материал

Деградация

Компьютеры становяться быстрее — программы становяться медленнее. С каждым годом мы создаем софт всё хуже.

Из-за мощности современных компьютеров, ширины каналов и объемов памяти мы совсем перестали заботиться о скорости работы программ, их размере и потребляемых ресурсах. Пора задуматься об этом и начать создавать быстрые приложения.

Статья Никиты Прокопова — Моё разочарование в софте

#производительность