Часто мы думаем, что async/await — панацея от блокировок и лагов. Но на самом деле внутри браузера всё куда сложнее: event loop, microtasks, rendering pipeline.
#under_hood #js
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤12👏1
SR и гидрация обещают быстрый рендер, но на деле фронтендеры часто сталкиваются с расхождениями между сервером и клиентом.
#under_hood
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4👍1
Понимание критического пути рендеринга: DOM, CSSOM, Render Tree.
Интерактивный инструмент, показывающий, какие свойства CSS вызывают перерасчёт layout и перерисовку.
Разбираем, как движок V8 оптимизирует JS через hidden classes и inline caching.
Как работает Event Loop, микротаски и макротаски, и что это значит для асинхронного JS.
Почему новые протоколы HTTP ускоряют загрузку страниц и улучшают UX.
#under_hood #css
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4🔥1
Чтобы не теряться в потоке постов, мы собрали удобную навигацию по тегам. Всё нужное — в пару кликов:
#readme — код-сниппеты, CSS-трюки, JS one-liners, команды Git/CLI
#hotfix — реальные баги и проблемы с объяснением, как их исправить
#blueprint — high-level концепции и паттерны
#under_hood — разбираем, что происходит внутри фреймворков и браузера
#stack — обзоры библиотек, плагинов, инструментов
#release_digest — все важное за неделю/месяц в одном месте: новые версии фреймворков, релизы библиотек, ссылки и краткие описания
#code_challenge — интерактивные задачи с разбором на следующий день
#code_battle — столкновение технологий или подходов
#pixel_pause— мемы, юмор и забавные истории из фронтенд-жизни
#career_merge — советы по резюме, soft skills, вопросы с собеседований, обсуждение зарплат
#ux_review — изучаем интерфейсы и UX известных сайтов и приложений
#read_watch — подборки полезных материалов: статьи, конференции, GitHub, книги
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4🔥1
Кажется, что это просто поиск элемента на странице — но под капотом браузер делает куда больше.
Он использует готовые структуры DOM и CSSOM, разбирает селектор в токены и выполняет оптимизированный поиск с кешами и хеш-таблицами.
#under_hood #js
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥3🥰3❤2👍1
Страница вроде простая, но со временем начинает тормозить, а Chrome показывает +1 ГБ к потреблению памяти.
Знакомо?
#under_hood #js
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7🥰3🔥2
Вы жмёте кнопку, ждёте обновления, а в ответ — тишина. React не глючит — он просто решил подождать, пока вы нажмёте ещё раз.
— как именно React «пакует» несколько setState в один рендер
— когда batching работает, а когда — нет
— и зачем в редких случаях нужен
flushSync
, если важно обновить прямо сейчас#under_hood #react
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4👍2🥰2
Переменная «живет» после выхода из функции, а память не освобождается.
Мы собрали 4 карточки, чтобы разобраться, как именно это устроено под капотом
#under_hood #js
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤5⚡1🔥1