For Web — фронтенд, дизайн, программирование
15.3K subscribers
5.44K photos
2 videos
5 files
1.71K links
Годнота для фронтендеров и дизайнеров

https://forweb.dev
Download Telegram
isolation: недооценённое CSS-свойство для решения проблем с z-index, создающее новый контекст наложения без побочных эффектов → https://dev.to/francescovetere/the-css-property-you-didnt-know-you-needed-3fk0
Заблуждения о специфичности в CSS: как считается специфичность и влияют ли на неё инлайн-стили и !important → https://www.bram.us/2024/05/05/misconceptions-about-css-specificity
Tailwind vs семантическая разметка и стили: сравнение вёрстки одной и той же страницы с использованием противоположных подходов → https://nuejs.org/blog/tailwind-vs-semantic-css/
URLPattern, новый API для сопоставления URL и парсинга параметров на основе шаблона, вдохновлённый библиотекой path-to-regexp → https://developer.mozilla.org/en-US/docs/Web/API/URL_Pattern_API
Почему 0.1 + 0.2 ≠ 0.3 в JavaScript и других языках: объяснение проблемы вычислений с плавающей точкой и примеры из разных языков программирования → https://0.30000000000000004.com
Moveable, библиотека для ресайза, перемещения, поворота, масштабирования и других трансформаций элементов пользователем → https://github.com/daybrush/moveable
Обзор новых методов итераторов: map, filter, take, drop, reduce, flatMap и другие хелперы, вычисляющие результат лениво и работающие на бесконечных коллекциях → https://v8.dev/features/iterator-helpers
TypeHero, платформа для изучения TypeScript на практике с готовыми задачами и возможностью создания собственных задач → https://typehero.dev
Дилеммы, с которыми вы столкнётесь при разработке библиотеки компонентов: обзор неочевидных вопросов и проблем, о которых стоит подумать заранее → https://github.com/andrico1234/the-dilemmas-youll-face
Как инженеры 1Password ускорили сборку браузерного расширения на 90% с помощью esbuild: от идеи для хакатона до продакшена → https://blog.1password.com/new-extension-build-system/
Виртуальная DOM в 200 строк JavaScript: пишем собственную реализацию механизма, используемого под капотом React и других UI-библиотек → https://lazamar.github.io/virtual-dom/
Сравнение способов анимирования в вебе на примере прыгающего мячика: от чистых CSS и JS до WebGPU и специализированных библиотек → https://sparkbox.github.io/bouncy-ball/
Athena Crisis, пошаговая стратегия на веб-технологиях, выложенная в опенсорс для обучения и разработки собственных игр → https://athenacrisis.com/open-source/
Зачем и как движок Google-таблиц портировали с JavaScript на WasmGC (расширение WebAssembly для компиляции языков со сборкой мусора) → https://web.dev/case-studies/google-sheets-wasmgc
Анимированные эмодзи Noto Color Emoji: бесплатная коллекция анимированных эмодзи в форматах GIF, WebP и Lottie → https://googlefonts.github.io/noto-emoji-animation/
Экспериментальная поддержка TypeScript в Node.js: в Node.js добавили возможность запуска TS-файлов (без проверки типов). Документация и дальнейшие планы по развитию → https://github.com/nodejs/loaders/issues/217
От данных к визуализации: руководство по выбору подходящего типа визуализации для ваших данных и краткая справка по основым нюансам и способам реализации каждого графика → https://www.data-to-viz.com
Socket Runtime, новый инструмент для разработки мобильных и десктопных приложений на веб-технологиях → https://socketsupply.co

— использует вебвью, унифицируя его поведение между платформами
— стремится к минимальным накладным расходам оперативной памяти (±20 МБ) и размеру бинарников (1.5 МБ десктоп, ±13 МБ iOS и Android);
— предлагает более простую архитектуру приложения, чем Electron
— предоставляет собственный P2P-протокол и его реализацию для разработки P2P-приложений вроде безопасных чатов
Видео с прозрачностью в вебе: Джейк Арчибальд из Shopify делится исследованием возможных способов реализации и лучшим найденным решением → https://jakearchibald.com/2024/video-with-transparency/
Первый стабильный релиз Rspack: бандлер от ByteDance, совместимый с webpack-экосистемой, но в разы быстрее самого webpack → https://rspack.dev