Иван Акулов про разработку

2021-12-27 14:00:27 Эта картинка выглядит почти нормально. При этом 99.7% байт в ней — это данные про яркость, и только 0.3% — данные про цвет. Картинка выглядит почти нормально, потому что человеческий глаз замечает изменения в яркости гораздо лучше, чем в цвете.

Доклад c web.​dev live про то, как эту и другие особенности зрения используют алгоритмы сжатия изображений: 

Открыть/Комментировать

2021-12-23 15:31:00 Поговорил на Подлодке про веб-перформанс с Андреем Ситником, Владом Шиловым и Антоном Хлыновским:



Из интересного:

11:24 · Real User Monitoring — как и зачем собирать живые метрики с пользователей

18:02 · Перформанс интерфейса и перформанс выполнения бандла

21:39 · Почему мы перестали использовать спрайты, но всё ещё бандлим JavaScript

25:43 · Зачем делать микробиблиотеки

31:44 · Почему brotli сжимает лучше, чем gzip

48:11 · Как WASM ускоряет парсинг скриптов

1:02:48 · Оптимизация node_modules

1:15:03 · Когда мы перестанем использовать бандлеры, а также почему из браузеров убрали поддержку server push Открыть/Комментировать

2021-12-20 19:30:07 Рома Лютиков классно пишет про перформанс в Pitch (приложение для презентаций).

Про то, как в Pitch мониторят производительность: https://t.me/frontender_clj/116

Про декодинг изображений: https://t.me/frontender_clj/119 Открыть/Комментировать

2021-12-14 22:49:34 Приходите смотреть, как Тимур Шемсединов сегодня валил меня вопросами по архитектуре:

Открыть/Комментировать

2021-12-13 23:50:44 Как получить GDE

В 2019-м я получил тайтл Google Developer Expert. Если вы хотели инструкцию, как это сделать и зачем это вообще, то вот :)

Что это
Google Developer Expert — это тайтл, который Google выдаёт разработчикам, которые засветились в какой-то сфере. Всего сфер 15, моя — Web Technologies (с подкатегорией Performance).

«Засветились в сфере» — это выступают, пишут и ведут про это соцсети.

В чём профит
— Узнаваемая медалька. С тайтлом GDE проще попадать докладчиком на конфы, привлекать внимание на собеседованиях и доказывать свой авторитет. Также можно хвастаться, что вы крутой/крутая
— Доступ к Google-разработчикам. Например, меня добавили в слак и репозиторий, где я могу задавать вопросы напрямую разработчикам Chrome (я этим ни разу не пользовался ¯\_(ツ)_/¯). Также меня раз в месяц приглашают на созвоны, где Google-разработчики рассказывают, что нового в Chrome для веб-перформанса
— Редкие случайные бонусы. Один раз Google оплатил мне покупку веб-камеры, чтобы мне было проще вести вебинары
— Покрытие поездок (до ковида). До ковида Google покрывал билеты на самолёт и отели в городе, куда вы летели выступать на конференцию. Из-за ковида программу остановили

Больше бенефитов никаких. Сотрудником Google вы не становитесь, деньги вам не платят.

В чём ответственность
— Чтобы оставаться GDE, придётся продолжать писать статьи и выступать с докладами. Раз в год вас проверяют на соответствие статуса GDE и, если вы не проходите, удаляют из программы. Как выглядит проверка — не знаю, для GDE она незаметна
— В соцсетях придётся написать «Opinions are my own»

Как понять, подходите ли вы
Если вы часто пишете в блог или выступаете про что-то, и вас читают в соцсетях, скорее всего, вы проходите.

Но у нас у всех же impostor syndrome, да? Если вы ходите податься на GDE, но сомневаетесь, проходите ли вы — спросите совета у меня (@iamakulov) или у другого GDE (ловите их на конференциях!).

Когда я подавался на GDE, у меня было
— 10-20 статей про веб-разработку (с большим количеством прочтений), часть из них — про перформанс
— 2-4 доклада
— И то ли 500, то ли 1000 подписчиков в Твитере

Как выглядит подача
Заполнить огромную форму → пройти два собеседования → подписать NDA → профит.

Я не помню, что меня спрашивали на собеседованиях (кроме вопроса «зачем мне тайтл GDE»). Собеседования описаны в гайде Google по подаче на GDE.

Как податься
Чтобы податься, нужно, чтобы вас зарефёррил существующий GDE. Прочтите гайд по подаче, напишите мне, и я зарефёррю :) Открыть/Комментировать

2021-12-09 01:13:39 React Forget

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

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

Ну и посмотрите сам доклад, он супер короткий:



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

2021-12-09 01:13:39 (кричит от восторга) Открыть/Комментировать

2021-10-28 23:31:14 Самый подробный гид про то, как Реакт работает внутри, эвер (ещё и от мейнтейнера Редакса) → https://blog.isquaredsoftware.com/2020/05/blogged-answers-a-mostly-complete-guide-to-react-rendering-behavior/ Открыть/Комментировать

2021-10-22 12:30:05 И что с этим делать
Не используйте Typekit.
— Если те шрифты, которые вы подключаете через него, доступны и в Google Fonts, установите их — нет, не из Google Fonts, а из Fontsource
— Если шрифты недоступны, купите их на Fontspring (или попросите компанию купить — если вы никогда не просили, это проще, чем кажется) и подключите их через @font-face

Это сходу улучшит время первого рендера на сотни миллисекунд. Открыть/Комментировать

2021-10-22 12:30:01 ​​​​То есть браузер держал страницу невидимой, тратил 500 мс на подключение к p.typekit.net и ещё 200 мс на ожидание файла — и всё это, чтобы скачать пустой комментарий. А всё потому, что Adobe таким образом собирает аналитику.¯\_(ツ)_/¯

Ну и, конечно, веб-шрифты не начинают загружаться, пока не загрузятся все стили: Открыть/Комментировать