Превращение React приложения в устанавливаемый PWA с offline обнаружением, сервис-воркерами и темами

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

https://dev.to/alexgurr/turning-a-react-app-into-a-pwa-with-offline-detection-service-workers-and-theming-142i #react #pwa

33 концепции, которые должен знать каждый JavaScript разработчик
Тщательно подобранный набор ссылок на руководства по 33 различным областям JavaScript, в которых стоит хорошо разбираться

https://github.com/leonardomso/33-js-concepts#readme #js

jest-extended 1.0: Дополнительные средства сопоставления Jest.

Если вы используете Jest для тестирования, в этом проекте представлены различные более конкретные средства сопоставления для различных ситуаций, особенно в отношении проверки типа и формата.

https://github.com/jest-community/jest-extended #tools #testing

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

https://github.com/handtracking-io/yoha #js @tools

Что нового в Gatsby 4
Gatsby - это популярный фреймворк с открытым исходным кодом на основе React, а в версии 4 представлены новые методы рендеринга контента (такие как отложенная статическая генерация), новая архитектура сборки и развертывания, новые CMS APIs и многое другое.

https://www.gatsbyjs.com/blog/whats-new-in-gatsby-4/ #js #tools

Оптимизация загрузки ресурсов с помощью Priority Hints
Узнайте о подсказках приоритета, которые указывают на относительную важность ресурсов для браузера. Они могут обеспечить оптимальную загрузку и улучшить Core Web Vitals.

https://web.dev/priority-hints/ #performance

Более 100 алгоритмов и структур данных, продемонстрированных на JS

Примеры многих распространенных алгоритмов и структур данных с пояснениями( доступных на разных языках)

https://github.com/trekhleb/javascript-algorithms #js #algorithms

5 инструментов для оптимизации и ускорения вашего React приложения во время разработки

https://javascript.plainenglish.io/5-packages-to-optimize-and-speed-up-your-react-app-during-development-51d7e4297d8d #react #tools

Вам больше не нужен JWT
Более простой способ аутентификации пользователей с помощью web3 подписанных сообщений

https://medium.com/@bytesbay/you-dont-need-jwt-anymore-974aa6196976

Todo Tree
Расширение для VS Code, которое быстро ищет в вашем рабочем пространстве теги комментариев, такие как TODO и FIXME, и отображает их в виде списка.

https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree #tools #vscode

Gitleaks
Инструмент безопасности для обнаружения захардкодженых секретов, таких как пароли, ключи API и токены, в репозиториях Git.

https://github.com/zricethezav/gitleaks #tools

Вышел Next.js 12
Большой шаг вперед с улучшениями middleware, поддержку нативных ES модулей, компилятор на базе Rust для ускорения сборки в 5 раз, URL Imports (alpha)
React Server Components (alpha) и многое другое.

https://nextjs.org/blog/next-12 #react #nextjs

Как создать React компонент таблицы с   сортировкой, фильтрацией и пагинацией

https://www.taniarascia.com/front-end-tables-sort-filter-paginate/ #react

Предотвращение цепочки прокрутки с overscroll-behavior

https://ishadeed.com/article/prevent-scroll-chaining-overscroll-behavior/ #css

Новые стандарты HTTP для кэширования в современном вебе

Узнайте о недавней работе по запуску двух новых черновиков стандартов HTTP-заголовков, призванных упростить отладку кэширования и обеспечить больший контроль над конфигурацией кеша.
https://httptoolkit.tech/blog/status-targeted-caching-headers/

Думаете, вы крутой разработчик? Тогда докажите это на Hiring Event от Авиасейлс!

17 ноября состоится набор разработчиков на фронтенд-направления в Авиасейлс. Они ищут людей сразу в несколько команд, где вы сможете заняться:

— созданием виджетов, API и White label-решений;
— разработкой новых инструментов монетизации;
— прокачкой пользовательских интерфейсов;
— разработкой нового контента и многим другим.

Если вы владеете JavaScript или TypeScript, React и связанными с ним инструментами, можете отличить SASS от SCSS, то скорее оставляйте заявку на участие.

Это не обычное собеседование с HR и долгим ожиданием ответа — пройдите тестовое задание, техническое собеседование, где вам помогут правильно проявить свои навыки и пообщайтесь с менеджером. Если всё ок, то уже через пару дней вы получите оффер с крайне заманчивым предложением сотрудничества, включающим удалёнку, ДМС и много других приятных бонусов.

Все подробности, а также отзывы разработчиков можно узнать здесь: https://tprg.ru/NRGx

Sparse и dence массивы в JavaScript

https://dmitripavlutin.com/javascript-sparse-dense-arrays/ #js

Глубокое погружение в object-fit и background-size в CSS

https://www.smashingmagazine.com/2021/10/object-fit-background-size-css/ #css

Cоздание эффективного Image компонента для Next.js
История нестандартного решения для оптимизации изображений для Next.js. Он оптимизирует загрузку, сжатие и отзывчивость. Теперь с поддержкой AVIF в Next.js 12.

https://web.dev/image-component/ #nextjs #performance

React Conf 2021: онлайн, бесплатно, 8 декабря.

https://conf.reactjs.org/  #react #event