For Web — фронтенд, дизайн, программирование
14.5K subscribers
5.47K photos
7 videos
5 files
1.74K links
Новости и полезности для фронтендеров.
Поддержать, чтобы в канале не было рекламы:
https://patreon.com/forweb
https://boosty.to/forweb
Download Telegram
Руководство по стилям для печати в 2018 году, Рейчел Эндрю на Smashing Magazine → https://www.smashingmagazine.com/2018/05/print-stylesheets-in-2018/
Browserslist, список поддерживаемых в проекте браузеров, используемый инструментами вроде Автопрефиксера и @babel/preset-env → https://github.com/browserslist/browserslist
По всему миру существуют и используются другие браузеры помимо популярных Chrome, Firefox, Edge и Safari. Например, в Африке около 100 миллионов пользователей Opera Mini, а в Китае очень популярен UC Browser. Важно поддерживать и их тоже, потому что иначе исчезнет конкуренция и повторится история монополизма IE6.

Как при составлении browserslist избежать распространённых ошибок, поощряющих монополию популярных браузеров? Рекомендации Андрея Ситника, создателя browserslist, PostCSS и Автопрефиксера:

1. Не используйте выборку по последним версиям конкретных браузеров, используйте более общие запросы: не last 2 Chrome versions, а просто last 2 versions (last 2 Chrome versions ок, только если вы разрабатываете приложение конкретно под Хром).

2. Если вы разрабатываете десктопный сайт, не удаляйте из browserslist мобильные браузеры (не пишите not last 1 Android version и т. п.), потому что с мобильных тоже заходят на десктопные версии сайтов.

3. Не используйте выборку только по проценту рынка браузеров (> 1%), совмещайте её с last n versions, иначе в неё не попадут популярные на локальных рынках браузеры.

4. Исключайте «мёртвые» браузеры не по наитию (не удаляйте браузеры вроде UC Browser только потому, что не слышали о них), а с помощью запроса not dead.
pitercss_conf, первая в России доступная конференция европейского уровня с докладчиками со всего мира, пройдёт 8–9 июня в Санкт-Петербурге → https://pitercss.com/
Минко Гечев и Эдди Османи представили Guess.js, набор инструментов для умного бандлинга и расстановки prefetch-подсказок на основе статистики посещений сайта → https://blog.mgechev.com/2018/05/09/introducing-guess-js-data-driven-user-experiences-web/
Как адаптировать интерфейс под язык, читаемый справа налево? Ребята из 2ГИСа о своём опыте адаптации интерфейса сервиса под арабский язык, часть первая, теоретическая — https://habr.com/p/358148
Обзор принципов работы и внутреннего устройства Prepack, интерпретатора JS, который на этапе сборки вычисляет всё, что можно вычислить, за счёт чего итоговый код получается меньше и быстрее → https://gist.github.com/gaearon/d85dccba72b809f56a9553972e5c33c4
В CSS планируют добавить переменные окружения, которые, возможно, получится использовать в медиавыражениях. Крис Койер с подробностями → https://css-tricks.com/css-environment-variables/
Ведите логи изменений! Зачем и кому они нужны, как их правильно вести и не тратить много усилий на поддержку, как их не испортить → https://keepachangelog.com/ru/1.0.0/
Руководство новичка по Meteor, платформе для быстрой разработки веб-приложений: от основных принципов до обзора простого приложения и инструментов → https://flaviocopes.com/meteor/
Ежегодный отчёт Google о том, как компания помогала развитию веб-платформы и что из этого получилось: сервис-воркеры, PWA, WebAssembly, Lighthouse, AMP, Web Packaging, Polymer, Angular; подробности и записи докладов с Google I/O → https://blog.chromium.org/2018/05/the-state-of-web-at-google-io-2018.html
This media is not supported in your browser
VIEW IN TELEGRAM
TIC-80, опенсорсный эмулятор придуманного компьютера для разработки игр со встроенной командной строкой и редакторами кода, спрайтов, карт и музыки → https://tic.computer/
Как помочь развитию Node.js: общие рекомендации для новых контрибьюторов и список технических и нетехнических областей, в которых проекту нужна помощь → https://nodesource.com/blog/how-you-can-start-contributing-to-node-js-today
Новые возможности CSS, которые меняют веб-дизайн, обзор Зела Лью на Smashing Magazine → https://www.smashingmagazine.com/2018/05/future-of-web-design/
This media is not supported in your browser
VIEW IN TELEGRAM
ntl (npm task list), интерактивное меню для просмотра и запуска npm-скриптов проекта с поддержкой вывода описания каждого скрипта → https://github.com/ruyadorno/ntl
Возможно, вам не нужны библиотеки вроде Redux, MobX, Rx или Cerebral: введение в Meiosis, простой паттерн управления состоянием → https://medium.com/p/6a735b150a02