Браузер. Рендеринг. Производительность

Второй год я помогаю с поиском спикеров на CodeFest — крупнейшая конференция за Уралом. В прошлом году у нас выступал Сергей Ufocoder — автор канала @ufostation — с докладом "Браузер. Рендеринг. Производительность".

В докладе рассказывается о производительности рендеринга в Chromium с точки зрения архитектуры браузера. Подробно объясняется работа пайплайна рендеринга на примере about://tracing и профилировки страниц с помощью вкладки Performance в DevTools. Рассматриваются несколько случаев оптимизации производительности с объяснением, почему это работает именно так. При подготовке доклада Сергей консультировался с официальной документацией Chromium и с разработчиками браузера.

Доклад немного хардкорный, но полезный. Рекомендую посмотреть.

#performance #chromium #internals #talks

https://www.youtube.com/watch?v=tbDxm1hiEI4

Ускорение отрисовки комментарии Хабра

Станислав Лашманов поделился опытом ускорения отрисовки комментариев в web-версии Хабра — "Как мы ускоряли комментарии Хабра".

Фронтенд Хабра — это SPA-приложение, написанное на Vue.js. Самой большой проблемой после переписывания фронта Хабра стала производительность комментариев. Страницы с большим количеством комментариев рендерились медленно, а на слабых устройствах им не хватало памяти.

Для решения этой проблемы ребята реализовали стриминг. Благодаря ему комментарии рендерятся на сервере и по мере готовности передаются на клиент. Клиенту больше не приходится ждать загрузки всех комментариев. Однако с добавлением стриминга возникли другие проблемы: перестали работать якорные ссылки, надо было реализовывать восстановление скролла после перезагрузки страницы, были проблемы с переходами по истории. Все проблемы удалось решить.

Респект ребятам за то, что смогли дотащить эту фичу, но работы у них ещё осталось много. Хабр сейчас работает гораздо медленнее по сравнению со старой версией — оценка производительности в Lighthouse 25 баллов из 100. С точки зрения обычного пользователя кажется, что переход на SPA был не самой хорошей идеей.

#performance #spa #vue

https://habr.com/ru/company/habr/blog/590111/

Фонд UI

Chrome начал спонсировать независимых разработчиков и исследователей, работающих над вебом — "The UI fund".

На грант могут податься все желающие. Нет ограничений по срокам подачи заявок. Основное условие — работа над проектом, затрагивающим CSS, HTML или UI-инструменты. Под эти категории попадают инструменты для работы c HTML и CSS, работа над спецификациями или UI-исследованиями, работа в области доступности или работа над Open UI. Ведут проект Сара Дразнер и Николь Салливан. Для поддержки будут привлекаться эксперты из индустрии.

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

#opensource #announcement

https://web.dev/ui-fund/

Rainer 1.0 — узкий акцидентный гротеск с высокой талией. Рудигер, его автор, начал работу над шрифтом ещё в 2014 году, и вот теперь добрался до релиза на Future Fonts.

В семействе 6 вариантов насыщенности, начертания есть прямые и с обратным наклоном. То есть, 12 шрифтов в сумме.

Лицензия стоит от 360 $, по начертаниям не продаётся.

Купить: futurefonts.xyz/rudiger/rainer/

#sans #decore

React Forget

Только что Xuan Huang (работал над Hermes) презентовал свой ресёрч React Without Memo.
Это компилятор, который позволит не использовать React.memo, генерируя код, который будет мемоизироваться автоматически. Пока что это закрытый эксперимент (React Forget это кодовое название) и не факт, что он завершится удачно.

Прикладываю 3 скриншота:
1. как выглядит мемоизированный код, который мы пишем сейчас;
2. как может выглядеть исходный код с использованием такого компилятора;
3. результат компиляции.

Ну и посмотрите сам доклад, он супер короткий: https://youtu.be/CzTXnOJj-uc?t=6906

P.S. Очень рад, что команда React двигается в эту сторону. Мне кажется, я до сих пор не понимаю когда мне нужен useCallback, а когда не особо, и, главное, как всё это правильно написать.

Злая Марсианка Вика Мельникова обсудила тонкости найма команды продуктовой разработки на подкасте #TechForNonTechies с Софией Матвеевой. Автор подкаста — ментор и создатель Enty, в разработке которого нам довелось поучаствовать.

http://amp.gs/jtjfg

Сайт Nomads, независимого журнала о фотографии: → https://nomadsphotomag.com/

#СделаноВReadymag

🤖 Хотите работать в геймдеве или воплотить свою идею игры? 

👉 Узнайте, как освоить тренды разработки на Unity на Demo Day 9 декабря в 20:00 на встрече с Антоном Барановым, проджект менеджером в Sber AR/VR Lab который ответит на все ваши вопросы о Unity.

📌 Разберем вакансии и требования компаний к специалистам. Преподаватель представит программу онлайн-курса «Unity Game Developer. Basic» и формат обучения. 
Вы узнаете, чем этот курс отличается от конкурентов, какие игры вы будете создавать и получите возможность сэкономить на обучении.

👉 Регистрируйтесь на вебинар и задайте свои вопросы эксперту в прямом эфире https://otus.pw/wvjt/