For Web — фронтенд, дизайн, программирование
14.7K subscribers
5.47K photos
7 videos
5 files
1.74K links
Новости и полезности для фронтендеров.
Поддержать, чтобы в канале не было рекламы:
https://patreon.com/forweb
https://boosty.to/forweb
Download Telegram
Инженеры Wikipedia избавились от 7,8 КБ минифицированного JS, отказавшись от mustache.js в пользу обычных шаблонных строк → https://phabricator.wikimedia.org/phame/post/view/90/mustache.js_replaced_with_javascript_template_literals_in_extension_popups/
Почему стоит использовать <article>, а не <section>, и когда <section> всё-таки может пригодиться? Брюс Лоусон разбирается в нюансах семантики и доступности → https://www.smashingmagazine.com/2020/01/html5-article-section/
Раскрываем тайны браузеров: Эрик Лоуренс из команды Microsoft Edge с обзором ресурсов, которые помогут узнать, как устроены и работают браузеры → https://textslashplain.com/2020/02/09/demystifying-browsers/
Каскад в CSS, или как браузер выбирает между конкурирующими стилями: иллюстрированный интерактивный обзор Амелии Уотенберг → https://wattenberger.com/blog/css-cascade
Новый фронтенд Одноклассников: запуск React в Java.

Часть 1: исторический экскурс и особенности серверной реализации нового фронтенда → https://habr.com/p/480808

Часть 2: запуск, сборка, интеграция и специфика приложений на новом стеке → https://habr.com/p/486810
This media is not supported in your browser
VIEW IN TELEGRAM
Пошаговое руководство по созданию ripple-эффекта при нажатии на кнопки → https://blog.logrocket.com/designing-ripple-effect-ui-feedback
Эмиссия углекислого газа в вебе: Дэнни ван Кутен делится результатами оптимизации своих продуктов и призывает не оставаться в стороне → https://dannyvankooten.com/website-carbon-emissions/
Type Route, новый универсальный роутер с фокусом на типизации → https://www.type-route.org
Git Explorer, сервис для поиска git-команд исходя из задачи → https://gitexplorer.com
Одна и та же разметка, разные стили: Ахмад Шадид повторяет идею проекта CSS Zen Garden, верстая разные дизайны без изменения разметки → https://ishadeed.com/article/same-html-different-css
This media is not supported in your browser
VIEW IN TELEGRAM
Опенсорсные сервисы для передачи файлов между девайсами в локальной сети по WebRTC:

ShareDrop → https://github.com/cowbell/sharedrop
Snapdrop → https://github.com/RobinLinus/snapdrop
filedrop-web → https://github.com/mat-sz/filedrop-web
Как я сделал собственный браузер: Килиан Вальхоф делится опытом разработки браузера, заточенного под задачи фронтендеров → https://kilianvalkhof.com/2020/design/how-i-built-my-own-browser/
Web Security Essentials, видеокурс Майка Шерова по основам защиты веб-приложений от MITM, CSRF и XSS-атак → https://egghead.io/courses/web-security-essentials
Атрибут loading=lazy для нативной ленивой загрузки изображений одобрили и добавили в спецификацию HTML → https://github.com/whatwg/html/pull/3752#issuecomment-585202516
Четыре способа обмена значений переменных в JavaScript: Дмитрий Павлютин с решениями распространённой на собеседованиях задачи → https://dmitripavlutin.com/swap-variables-javascript/
Избавляемся от утечек памяти в веб-приложениях: Нолан Лоусон о техниках поиска и исправления утечек → https://nolanlawson.com/2020/02/19/fixing-memory-leaks-in-web-applications/
Семантическая система цветов в приложении для ведения бюджета YNAB: теория и практика с точки зрения разработчиков и дизайнеров → https://dev.to/ynab/a-semantic-color-system-the-theory-hk7
esbuild, очень быстрый экспериментальный бандлер и минификатор JavaScript, написанный на golang → https://github.com/evanw/esbuild
Простой способ улучшить UX: добавляйте width и height к изображениям в HTML, чтобы браузеры могли сразу зарезервировать под них пространство на странице → https://youtu.be/4-d_SoCHeWE