Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
•
Подкаст «Веб-стандарты» #86: Как вписаться в iPhone X, редакторы кода, инверсная тема в 153 байтах, жизнь после git --force, история гридов, вёрстка и программирование, ES-модули в Node и в бою.
•
Подкаст «Пятиминутка React» #35: FrontFest 2017
•
Подкаст «Frontend Weekend» #19: Юрий Артюх учит как стать самым красивым верстальщиком рунета
•
Подкаст «Фронтенд Юность (18+)» : FrontTalks — лучшая конференция в галактике
•
Подкаст «Веб-стандарты», Episode #85: Ага Наплоха, Гарри Робертс, Ева Леттнер, Зак Лезерман и Хьюго Жирадель в специальном выпуске «Веб-стандартов»
•
Подкаст «Drinkcast», Выпуск #8: «Что такое FrontOps»
•
«ALL YOUR HTML» #14: «Анимируем графики на SVG и Canvas, + perlin noise»
•
HTML Шорты: Математика для программиста, плюс текстовая версия
•
Доклады с Frontend Mix: оптимизация загрузки сайтов и дизайн-система на БЭМ и React
• Ошибки и спорные вопросы в HTML-CSS вёрстке
• Еженедельная подборка красивых эффектов на CSS/SVG/JS #53
•
Как убрать белые полосы в Safari на iPhone X (background-color, viewport-fit, safe-area-inset-*)
• Доступ к CSS-переменным и их изменение с помощью Javascript
• Заблокированные кнопки — отстой
•
CSS-in-JS — это как заменить сломаную отвертку вашим любимым молотком
•
Полное руководство по Flexbox? — изучение по примерам
•
Новое руководство по поддержке CSS в письмах от campaignmonitor
•
Видео о создании CSS Grid. Посмотрите, как CSS Grid Layout прошел путь от идеи до реального распространения во всех основных браузерах в 2017
•
Удаление неиспользуемых правил CSS
•
Devices.css — подборка современных устройств, воссозданных на «чистом CSS»
• Почему Facebook SDK занимает около 16% JavaScript-кода на сайтах и что это значит
•
Babel: изменения, запланированные для версии 7.0
•
О том, как можно уменьшить влияние третьесторонних JS скриптов на производительность всего сайта
•
Как работает JavaScript: управление памятью + как бороться с четырьмя распространёнными утечками памяти
•
Готовы ли поисковые остальные движки, кроме Google, к краулингу и индексированию JavaScript?
•
Что я люблю и ненавижу во Flow
•
Есть ли смысл в людях, которые не могут писать JavaScript?
•
В Chrome 64 будет прекращено автоматическое воспроизведение видео со звуком, а FTP будет помечаться, как небезопасный протокол
•
Проект Mozilla представил дополнение с реализацией контекстных контейнеров для Firefox
•
В Firefox 57 будет обновлён внешний вид средств для разработчиков
• iPhone X, iPhone 8 и 8 Plus, Apple Watch Series 3 и Apple TV 4K
• Российские дизайнеры и разработчики об iPhone X, iPhone 8 и других анонсах презентации Apple
• W3C разработал API для криптовалютных платежей в браузерах
• Нейросеть дня: 3D-маска лица на основе фотографии
• Выпуск Vagrant 2.0, инструментария для создания виртуальных окружений
• Сеть казино скомпрометировали через «умный» аквариум
• Компания Oracle выбрала Eclipse Foundation для передачи разработки Java EE
• Человеческий мозг планируют подключить к «интернету вещей»
• Почему Кремниевую долину критикуют все чаще, и что с этим делать
?
> Дайджест за прошлую неделю
Материал подготовили dersmoll и alekskorovin

Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
•
Подкаст «Веб-стандарты» #86: Как вписаться в iPhone X, редакторы кода, инверсная тема в 153 байтах, жизнь после git --force, история гридов, вёрстка и программирование, ES-модули в Node и в бою.•
Подкаст «Пятиминутка React» #35: FrontFest 2017•
Подкаст «Frontend Weekend» #19: Юрий Артюх учит как стать самым красивым верстальщиком рунета•
Подкаст «Фронтенд Юность (18+)» : FrontTalks — лучшая конференция в галактике •
Подкаст «Веб-стандарты», Episode #85: Ага Наплоха, Гарри Робертс, Ева Леттнер, Зак Лезерман и Хьюго Жирадель в специальном выпуске «Веб-стандартов»•
Подкаст «Drinkcast», Выпуск #8: «Что такое FrontOps»•
«ALL YOUR HTML» #14: «Анимируем графики на SVG и Canvas, + perlin noise» •
HTML Шорты: Математика для программиста, плюс текстовая версия•
Доклады с Frontend Mix: оптимизация загрузки сайтов и дизайн-система на БЭМ и React
Веб-разработка
• Ошибки и спорные вопросы в HTML-CSS вёрстке
• Еженедельная подборка красивых эффектов на CSS/SVG/JS #53
•
Как убрать белые полосы в Safari на iPhone X (background-color, viewport-fit, safe-area-inset-*) - Производительность:
•
Как ускорить загрузку сайта
•
Заметка на hacks.mozilla.org о быстром построении DOMа — рискованный парсинг, async, defer и preload
•
Addy Osmani о том, как на Treebo радикально повысили скорость работы мобильной версии сайта (React/Preact PWA)
- Инструменты:
•
О-о-очень долгожданный релиз Sublime Text 3.0
• Текстовый редактор Atom стал средой разработки
•
Прототипирование возможностей DevTools в будущих версиях браузеров
- Wordpress:
• WordPress отказывается от React, Gutenberg будет переписан на основе другой библиотеки
• Gutenberg предлагает новый подход к TinyMCE в WordPress 5.0
• Gutenberg 1.1.0: новые возможности редактора
CSS
• Доступ к CSS-переменным и их изменение с помощью Javascript
• Заблокированные кнопки — отстой
•
CSS-in-JS — это как заменить сломаную отвертку вашим любимым молотком•
Полное руководство по Flexbox? — изучение по примерам•
Новое руководство по поддержке CSS в письмах от campaignmonitor•
Видео о создании CSS Grid. Посмотрите, как CSS Grid Layout прошел путь от идеи до реального распространения во всех основных браузерах в 2017•
Удаление неиспользуемых правил CSS•
Devices.css — подборка современных устройств, воссозданных на «чистом CSS»
JavaScript
• Почему Facebook SDK занимает около 16% JavaScript-кода на сайтах и что это значит
•
Babel: изменения, запланированные для версии 7.0•
О том, как можно уменьшить влияние третьесторонних JS скриптов на производительность всего сайта•
Как работает JavaScript: управление памятью + как бороться с четырьмя распространёнными утечками памяти•
Готовы ли поисковые остальные движки, кроме Google, к краулингу и индексированию JavaScript?•
Что я люблю и ненавижу во Flow•
Есть ли смысл в людях, которые не могут писать JavaScript?- ES2015+:
•
Применение ES2015+ кода на продакшене уже сегодня
•
Async/Await сделают ваш код проще
•
Асинхронная рекурсия с помощью Callbacks, Promises и Async.
•
Простое объяснение монад в JavaScript
•
HTML шаблоны, реализованные с помощью JavaScript Template Literals
- Теория:
•
JavaScript: загадочное дело выражения null >= 0
•
Думать как JavaScript. Перевод статьи Кайла Симпсона “Thinking JavaScript”
•
JavaScript: методы асинхронного программирования
•
Почему “throttling” и “debouncing” так называются?
•
ООП в JavaScript
VueJS:
• Паттерны разделения кода приложения на Vue.js
•
Функции рендера Vue.js и transitions
•
Phytochemia: почему мы выбрали Vue.js
React:
•
Что нового в React 16?. В статье рассмотрен пример создания музыкального плеера с использованием некоторых функций нового React
•
React для Angular разработчиков
•
Как организовать больше приложение на React и сделать его масштабируемым
•
react-powerplug — создает состояние и передает логику его детям, давая жизнь dumb компонентам
Angular:
•
Как я перестал любить Angular
•
Использование Веб Компонентов с Angular
•
Начало работы с End-to-End тестированием в Angular с использованием Protractor
•
Проблемы с защитой роута в Angular
- Libs & Plugins:
•
p-progress — создание промиса, который сообщает о прогрессе.
•
punchcard — jquery плагин для создания графиков в стиле GitHub перфокарт
•
classwrap — js утилита для конкатенации имен CSS классов по заданным условиям
•
ellipsed — JS библиотека для добавления троеточия в многострочных текстах
Браузеры
•
В Chrome 64 будет прекращено автоматическое воспроизведение видео со звуком, а FTP будет помечаться, как небезопасный протокол•
Проект Mozilla представил дополнение с реализацией контекстных контейнеров для Firefox•
В Firefox 57 будет обновлён внешний вид средств для разработчиков
Занимательное
• iPhone X, iPhone 8 и 8 Plus, Apple Watch Series 3 и Apple TV 4K
• Российские дизайнеры и разработчики об iPhone X, iPhone 8 и других анонсах презентации Apple
• W3C разработал API для криптовалютных платежей в браузерах
• Нейросеть дня: 3D-маска лица на основе фотографии
• Выпуск Vagrant 2.0, инструментария для создания виртуальных окружений
• Сеть казино скомпрометировали через «умный» аквариум
• Компания Oracle выбрала Eclipse Foundation для передачи разработки Java EE
• Человеческий мозг планируют подключить к «интернету вещей»
• Почему Кремниевую долину критикуют все чаще, и что с этим делать
?
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
> Дайджест за прошлую неделю
Материал подготовили dersmoll и alekskorovin
vtvz_ru
Честно говоря, в статье «Что нового в React 16» я ожидал увидеть подробный разбор изменений и чем они полезны для нас. А нет, написание музыкального плеера с использованием некоторых фич нового реакта… Просто интересна целевая аудитория. Люди, которым интересны изменения в новой версии их инструмента, и сами смогут слепить плеер. А тех, кто хочет изучить библиотеку, вряд ли прельстит такой заголовок. Или я чего-то не понимаю?
* К подборке нареканий нет. Всегда огромное спасибо за ваш труд. Всегда с нетерпением жду новый выпуск)
derSmoll
Соглашусь. Статья для новичков возможно и неплохая, но с заголовком они однозначно промахнулись, либо намеренно занимаются кликбейтом. Что касается разбора изменений, рекомендую соответствующий выпуск Пятиминутки React