Советы по приведению легаси кода к нормальному состоянию:
— Webpack плагины для снижения веса бандла и удаления неиспользуемых файлов
— Eslint для статического анализа кода
— Sentry для логирования
— Добавление проверок на CI

https://habr.com/ru/company/domclick/blog/524606/

​​Surma пытается объяснить Jake Archibald WebAssembly, threads, WebAssembly Threads:
— Передача своих импортов в wasm
— Импорт выделяемой памяти в wasm
— Варианты общения главного процесса с процессом воркера: postMessage, SharedArrayBuffer
— Atomics vs while true для ожидания значения в другом потоке

Подробно и с визуализацией про javascript Promise:
— Состояния fulfilled, rejected, pending
— Методы then, catch, finally
— Обработка промисов в eventloop, разница микро и макро задач
— async await

https://dev.to/lydiahallie/javascript-visualized-promises-async-await-5gke

Checka11y.css - помогает в поиске проблем с доступностью интерфейсов, подключается как обычный css файл и подсвечивает некоторые проблемы разметки:
— картинки без alt тега
— видео с autoplay атрибутом
— проверка, что помимо <li> в <ol> и <ul> нет других элементов на первом уровне и другие проблемы доступности

Web Api наблюдатели с примерами использования:
1) ResizeObserver - наблюдение за изменением размеров целевого элемента.
2) IntersectionObserver - отслеживание попадания элемента во viewport.
3) MutationObserver - отслеживание изменения атрибутов, текстового содержимого целевого элемента и его потомков.

https://habr.com/ru/post/525536/

​​Туториал для улучшения навыков работы с командной строкой:
— сочетания клавиш: ctrl+x, ctrl+u, ctrl+k, ctrl+t
— команды: ^(замена текста в предыдущей команде), &(выполнение в фоновом режиме), nohup(не прерывать команду в фоновом режиме, даже после закрытия терминала) и много других полезных команд

Путь к изоморфной производительности рендеринга

Автор библиотеки SOLID написал очень подробную статью, как он внедрял SSR в библиотеку, с каким проблемами сталкивался, какие варианты рассматривал.
SOLID - одна из самых быстрых по производительности библиотек для построения интерфейсов на данный момент

#SSR #SOLID #en

https://indepth.dev/the-journey-to-isomorphic-rendering-performance

Сравнение архитектур разработки апи: REST vs GraphQL

#REST #GraphQL

https://blog.codota.com/rest-api-vs-graphql/

Магия машинного обучения для вашего веб-приложения с TensorFlow.js

TensorFlow.js - библиотека для машинного обучения на javascript, можно использовать в браузере и node.js Есть уже обученные модели, что позволяет быстро создавать полезные приложения.

“Из коробки” предоставляются следующие апи для решения частых ML задач:
— классификация изображений
— распознавание объектов
— определение позы
— голосовые команды
— классификация текста

#tensor_flow #ml

Обтекание текста вокруг элементов с помощью css свойства shape-outside

#css #shape_outside

https://css-tricks.com/creating-css-shapes-with-emoji/?utm_source=CSS-Weekly&utm_campaign=Issue-433&utm_medium=web

Генерация кода в angular проектах с помощью schematics
Используется для автоматизации написания бойлерплейта и обновления публичного апи библиотеки по коду проекта

#angular

https://ashatilovdev.medium.com/53-angular-uikit-be4ea6b5b7a5

Видео стриминг на nodejs
Небольшой туториал про разбивку и отдачу видео на клиент частями

#nodejs #video_streaming

https://dev.to/abdisalan_js/how-to-code-a-video-streaming-server-using-nodejs-2o0

Браузерные апи:
— Geolocation API - позволяет пользователю предоставлять свое местоположение web приложению
— Drag and drop API - для перемещения элементов на странице
— Web Storage API - хранилище сессии (sessionStorage), локальное хранилище (localStorage)
— Web Speech API - позволяет веб приложениям управлять голосовыми данными
— WebRTC API - позволяет сайтам захватывать и передавать аудио и видео, а также обмениваться данными между браузерами

#browser_api

https://habr.com/ru/company/ruvds/blog/525838/

Рендеринг страницы:
— парсинг html
— блокирующие парсинг html и отрисовку страницы ресурсы
— предварительная загрузка ресурсов
— парсинг CSS
— события загрузки
— отрисовка страницы

#browser_rendering

https://webdevblog.ru/kak-brauzer-renderit-veb-stranicu/

:focus-visible vs :focus
:focus-visible - используется для определения фокуса с клавиатуры
:focus - используется для определения любой фокусировки(клавиатура, мышь, тач)

#css

https://css-tricks.com/the-focus-visible-trick/