🤔 Стреляем себе в ногу из localStorage
Все фронтендеры любят localStorage — ведь в него можно прикопать данные без всяких баз и серверов. Но из localStorage можно отлично обстрелять себе ногу — автор делится шестью встроенными пулеметами и рассказывает, как с ними бороться:
🔫 Коллизии ключей
🔫 Изменение схемы данных
🔫 Рассинхрон схемы на чтение и на запись
🔫 Ошибки setItem
🔫 Чтение localStorage в SSR
🔫 Отсутствие изоляции между пользователями
Все фронтендеры любят localStorage — ведь в него можно прикопать данные без всяких баз и серверов. Но из localStorage можно отлично обстрелять себе ногу — автор делится шестью встроенными пулеметами и рассказывает, как с ними бороться:
🔫 Коллизии ключей
🔫 Изменение схемы данных
🔫 Рассинхрон схемы на чтение и на запись
🔫 Ошибки setItem
🔫 Чтение localStorage в SSR
🔫 Отсутствие изоляции между пользователями
📌 Какие темы вас ждут?
☑️ Роль стейт-менеджера в управлении состоянием в приложениях
☑️ Различия между функционально-реактивным и объектно-ориентированным реактивным программированием
☑️ Проблемы и преимущества React
☑️ Сложности дебага реактивного кода
☑️ Использование Reatom
☑️ Альтернативы Redux и другие подходы к управлению состоянием
⏱️ Таймкоды:
00:00 Интро и о спикере
04:08 Понятие состояния и его управление
09:45 Различные подходы к реактивному программированию
14:10 Проблемы с Backbone и появление React
23:05 Внесение сигналов в стандарт JavaScript
28:32 Проблемы дебага в реактивном коде
32:39 Использование аборт-контроллера в Reatom
38:20 Вдохновение от библиотек Cerebro.js и Kefir, а также паттерна Function 3
43:06 Библиотека Kefir и реактивность
46:25 Работа с асинхронными данными и персистентность в Reatom
49:16 Комьюнити Reatom
57:51 Альтернативы Redux: Redux Toolkit, MobX и Effector
58:46 Проблемы Redux Toolkit
01:05:26 Проблемы MobX
01:09:15 Преимущества Effector
01:10:07 Экосистема и готовые решения каждой библиотеки
01:11:52 Active Communities and Good Documentation
01:12:49 Zustand: Less Documentation and Use Cases
01:13:16 MobX's Optional Decorator
01:14:12 React Query for React Developers
01:14:59 Jotai: A Lightweight Alternative
01:15:53 Effector and Reatom: More Powerful but Complex
01:16:50 Choosing the Right Library
01:26:06 Решение проблемы с зомби-чудранами и управление ресурсами
01:28:00 Архитектурная организация атомов и файлов
01:29:35 Фабрики и паттерн computed factory
01:33:02 Минусы и текущие проблемы риатома
01:39:52 Недостатки риатома и реактивного программирования
01:40:21 Проблемы с дебаггингом в риатоме
01:41:20 Альтернатива реактивности: конечные автоматы
01:44:39 Библиотека FSMoothy для работы с конечными автоматами
01:48:31 Разница между состоянием и атрибутами в реактивном программировании
Please open Telegram to view this post
VIEW IN TELEGRAM
#css #tip by Shripal Soni
Please open Telegram to view this post
VIEW IN TELEGRAM
Forwarded from Библиотека девопса | DevOps, SRE, Sysadmin
💬😊 Как найти общий язык с коллегами на новой работе: 11 простых советов
Практичные советы для эффективной адаптации на новом рабочем месте и налаживания контакта с коллегами.
Читать статью
Практичные советы для эффективной адаптации на новом рабочем месте и налаживания контакта с коллегами.
Читать статью
🤔 CSS-классы вредны
Если вы когда-нибудь заглядывали за кулисы пользовательских веб-интерфейсов, то знаете для чего нужно свойство
Автор статьи рассказывает о том, почему настало время отказаться от него. Имена классов — это архаичная система, используемая как неудачный посредник для примитивов UI.
Ещё хуже то, что они создают ужасные сочетания, приводящие к комбинаторному взрыву странных пограничных случаев. Автор изучает этот вопрос, начав со скучного урока истории, который вы уже слышали миллион раз.
👉 Читать
Если вы когда-нибудь заглядывали за кулисы пользовательских веб-интерфейсов, то знаете для чего нужно свойство
class. Оно ведь нужно для связи HTML с CSS, правда? Автор статьи рассказывает о том, почему настало время отказаться от него. Имена классов — это архаичная система, используемая как неудачный посредник для примитивов UI.
Ещё хуже то, что они создают ужасные сочетания, приводящие к комбинаторному взрыву странных пограничных случаев. Автор изучает этот вопрос, начав со скучного урока истории, который вы уже слышали миллион раз.
👉 Читать
Вы наверняка знаете Dr. Axel по его замечательным записям в блоге на протяжении многих лет, но у него также есть впечатляющая коллекция книг, которые вы можете прочитать бесплатно, включая недавно обновленные Exploring JavaScript (ES2024 Edition), Deep JavaScript и Tackling TypeScript.
Please open Telegram to view this post
VIEW IN TELEGRAM
🛠 InfiniteGrid 4.12 — бесконечное размещение карточек в макете сетки
Зелый и проверенный способ создания сеток, состоящих из элементов карточек разных размеров. Успешно работает как на десктопах, так и на мобильных устройствах, имеет интеграцию с React, Vue, Angular, Svelte и другими.
👉 GitHub
Зелый и проверенный способ создания сеток, состоящих из элементов карточек разных размеров. Успешно работает как на десктопах, так и на мобильных устройствах, имеет интеграцию с React, Vue, Angular, Svelte и другими.
👉 GitHub
432. Доклады и лайвы, приватный Safari, анимация auto, SVG, ускорение…
Веб-стандарты
🎙Свежий выпуск подкаста «Веб-стандарты»: Вадим Макеев, Алексей Симоненко, Полина Гуртовая про видео докладов и лайвов, приватный Safari, анимацию auto, копирование SVG, ускорение Notion, Node.js, шрифты и State of React.
00:02:17 Доклады и лайвы
00:08:22 Такой приватный Safari
00:45:37 Анимация height: auto
00:55:00 Копирование SVG
01:00:20 Ускорение Notion
01:16:03 Node.js 22
01:23:46 Инкрементальные шрифты
01:44:28 State of React 2023
01:55:32 Ответы на вопросы
▶️ YouTube | Сайт подкаста
#подкасты #новости
00:02:17 Доклады и лайвы
00:08:22 Такой приватный Safari
00:45:37 Анимация height: auto
00:55:00 Копирование SVG
01:00:20 Ускорение Notion
01:16:03 Node.js 22
01:23:46 Инкрементальные шрифты
01:44:28 State of React 2023
01:55:32 Ответы на вопросы
▶️ YouTube | Сайт подкаста
#подкасты #новости
🤖🔞 Пишем Telegram-бота для фильтрации нецензурной лексики в чате
Автор «Библиотеки программиста» представил бесплатного Telegram-бота для фильтрации нецензурных выражений в чате Telegram, который разработан на JavaScript с использованием фреймворка grammY. В статье — основные составляющие Telegram-бота, необходимые для его работы.
👉 Читать статью
👉 Зеркало
Автор «Библиотеки программиста» представил бесплатного Telegram-бота для фильтрации нецензурных выражений в чате Telegram, который разработан на JavaScript с использованием фреймворка grammY. В статье — основные составляющие Telegram-бота, необходимые для его работы.
👉 Читать статью
👉 Зеркало
#css #tip by Shripal Soni
Please open Telegram to view this post
VIEW IN TELEGRAM
🆕 JavaScript эволюционирует: новые методы и функции для эффективной разработки
Нововведения нацелены на повышение читаемости и эффективности кода. Рассмотрим, как Object.groupBy, регулярные выражения с V-флагом, Promise.withResolvers и методы мутации массивов решают актуальные задачи программирования.
🔗 Читать статью
🔗 Зеркало
Нововведения нацелены на повышение читаемости и эффективности кода. Рассмотрим, как Object.groupBy, регулярные выражения с V-флагом, Promise.withResolvers и методы мутации массивов решают актуальные задачи программирования.
🔗 Читать статью
🔗 Зеркало
This media is not supported in your browser
VIEW IN TELEGRAM
💡Недооцененные возможности CSS grid: подробное руководство с множеством интерактивных демонстраций
Свежий взгляд на CSS grid template areas и на то, как сегодня использовать весь их потенциал.
👉 Читать
Свежий взгляд на CSS grid template areas и на то, как сегодня использовать весь их потенциал.
👉 Читать
Конкурс года в «Библиотеке программиста»: смонтируйте короткий вертикальный ролик формата Shorts/Reels* на тему программирования и разработки — лучший автор получит 40 тысяч рублей
Подробные условия:
Какие ролики мы не принимаем:
Таймлайн:
2 августа — заканчиваем принимать видео
⬇️
3 августа — начинаем загружать лучшие видео в инстаграм
⬇️
9 августа — подводим итоги
*Организация Meta признана экстремистской в РФ
Please open Telegram to view this post
VIEW IN TELEGRAM
Почувствуйте разницу между Static Site Generation (SSG), Server-Side Rendering (SSR), Client-Side Rendering (CSR), Incremental Static Regeneration (ISR) и Partial Prerendering (PPR).
👉 Читать
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
💬 Как вы оцениваете свой текущий уровень владения Git?
🤔 — начальный (основы: clone, commit, push)
👍 — средний (ветвление, слияние, разрешение конфликтов)
🔥 — продвинутый (rebase, cherry-pick, сложные сценарии слияний)
💯 — эксперт (внутреннее устройство Git, разработка собственных скриптов и инструментов)
🥱 — свой вариант (напишу в комментариях)
#холивар
🤔 — начальный (основы: clone, commit, push)
👍 — средний (ветвление, слияние, разрешение конфликтов)
🔥 — продвинутый (rebase, cherry-pick, сложные сценарии слияний)
💯 — эксперт (внутреннее устройство Git, разработка собственных скриптов и инструментов)
🥱 — свой вариант (напишу в комментариях)
#холивар
✍️ «Библиотека программиста» находится в поиске автора на написание книжных рецензий
Кто нужен?
● Энтузиасты (джуны и выше), которые которые разбираются в IT
● Любители книг, которые хотели бы получать деньги за чтение и написание рецензий
● Работаем с самозанятыми (компенсируем налог), ИП
Мы предлагаем частичную занятость и полностью удаленный формат работы — можно совмещать с основной и находиться в любом месте🌴
✉️ Станьте частью нашей команды — присылайте резюме и примеры работ [email protected]
Кто нужен?
● Энтузиасты (джуны и выше), которые которые разбираются в IT
● Любители книг, которые хотели бы получать деньги за чтение и написание рецензий
● Работаем с самозанятыми (компенсируем налог), ИП
Мы предлагаем частичную занятость и полностью удаленный формат работы — можно совмещать с основной и находиться в любом месте🌴
✉️ Станьте частью нашей команды — присылайте резюме и примеры работ [email protected]
This media is not supported in your browser
VIEW IN TELEGRAM
#devtools #tip by Shripal Soni
Please open Telegram to view this post
VIEW IN TELEGRAM
⚒️ Bash великолепен, но когда дело доходит до написания более сложных скриптов, многие предпочитают более удобный язык программирования.
JavaScript — идеальный выбор, но стандартная библиотека Node.js требует дополнительных хлопот перед использованием.
zx предоставляет полезные обёртки вокруг child_process, экранирует аргументы и дает разумные значения по умолчанию.
👉 GitHub
JavaScript — идеальный выбор, но стандартная библиотека Node.js требует дополнительных хлопот перед использованием.
zx предоставляет полезные обёртки вокруг child_process, экранирует аргументы и дает разумные значения по умолчанию.
👉 GitHub