Frontender Libs - обзор библиотек JS / CSS

Функциональность useEffectEvent в React

useEffectEvent в React это?

Забыли? Вернитесь к посту от 03.06.2024.

👉 @sWebDev

LokiJS

LokiJS – это JavaScript-библиотека, предоставляющая легковесную in-memory базу данных, предназначенную для использования в браузере или в среде Node.js. Она не требует установки дополнительных серверов или плагинов и работает исключительно в памяти, что обеспечивает высокую скорость операций.

👉 @sWebDev

Что не так с техническими собеседованиями в IT?

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

А вы сталкивались на собеседованиях с теоретизированностью?

👍 ― Да.

🤔 ― Нет, мне давали сразу реальные задачи.

👉 @sWebDev | #собес

Управление состоянием в React и Angular

Статья обсуждает подходы к управлению состоянием в двух популярных JavaScript-фреймворках: React и Angular. В статье сравниваются встроенные механизмы и сторонние библиотеки, используемые для управления состоянием в этих фреймворках.

👉 @sWebDev

PointLight Demo

Интерактивная сцена с шарами на Three.js.

👉 @sWebDev

Tesseract.js

Tesseract.js — это JavaScript-библиотека, позволяющая выполнять оптическое распознавание символов (OCR) непосредственно в браузере или на сервере Node.js. Она представляет собой порт популярного движка Tesseract OCR.

👉 @sWebDev

Пока не подводило.

👉 @sWebDev | #юмор

Circular Carousel MotionPath - Draggable & Inertia

Интерактивное колесо с лотереей на GSAP.

👉 @sWebDev

Отладка пользовательских хуков в React

useDebugValue() – это хук React, который позволяет разработчикам предоставлять дополнительную информацию о значении, возвращаемом пользовательским хуком, в инструментах разработчика React DevTools. Это упрощает отладку и понимание работы пользовательских хуков, особенно в сложных компонентах или библиотеках.

Как это работает:

Вы вызываете useDebugValue() внутри вашего пользовательского хука и передаете ему значение, которое хотите отобразить в DevTools. Дополнительно, вы можете передать функцию форматирования, которая преобразует значение в более удобный для чтения вид.

function useFriendStatus(friendID) {
  const [isOnline, setIsOnline] = useState(null);

  // ... логика для определения статуса друга ...

  useDebugValue(isOnline, (status) => status ?? 'Loading...');

  return isOnline;
}

В этом примере useDebugValue() отобразит в DevTools значение isOnline или строку "Loading...", если значение еще не получено.

👉 @sWebDev

Когда приложение ещё не готово, а клиент требует демо.

👉 @sWebDev | #юмор

Magic Grid

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

👉 @sWebDev

Использование strictTemplates

Для чего используется флаг strictTemplates в Angular?

Если забыли, то вернитесь к посту от 27.05.2024.

👉 @sWebDev

Parametric Surface

Пример реализации объёмных фигур на Three.js.

👉 @sWebDev

Как работает RSC

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

👉 @sWebDev

Just about time for lunch...

Параллакс анимация бургера на GSAP.

👉 @sWebDev

Mock

Mock.js - это JavaScript-библиотека для создания мок-данных, то есть фиктивных данных, имитирующих структуру и формат реальных данных.

👉 @sWebDev

Не хочется представлять баг спустя 10 часов...

👉 @sWebDev | #юмор

Click Spark

Анимация нажатия курсора на Anime.js.

👉 @sWebDev