Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда

Веб-разработка

CSS

Javascript

Браузеры

Новости и занимательное

Веб-разработка

• Я заглянул в папку node_modules, и вы не поверите, что произошло
• Подкаст Веб-стандарты, Выпуск №29: Похороны Flash, Samsung Internet, книга «Секреты CSS», цветовые функции, SVG, курсор для кнопки. В гостях — Роман Комаров
• Ревью верстки: 10 полезных замечаний и советов
• Вышел в свет WordPress 4.6 “Pepper” с оптимизированным управлением плагинами и темами
• 10k Apart — конкурс на создание полноценных сайтов или веб-приложений, ограниченных размером в 10Kb и функционирующих без JS. Работы оценивают Sara Soueidan, Rachel Andrew и другие
• Нужно писать меньше чертова кода, советует нам фрилансер Heydon Pickering (Writing Less Damn Code)
• Средняя веб-страница (результат анализа 8 миллионов веб-сайтов) (The Average Web Page (Data from Analyzing 8 Million Websites))
• Как предотвратить ваш сайт от атак повторного воспроизведения (How to Prevent Replay Attacks on Your Website)
• Скрытая сила компонентов шаблонов Handlebars (The hidden power of Handlebars partials)
• Обрезка миниатюрных изображений с помощью SVG (Cropping Image Thumbnails with SVG)
• Вещи, которые я выучил об отзывчивом дизайне шаблонов писем (Things I've Learned About Responsive Email Design)
• API:
  
  • Мониторинг веб-приложений
  • Оффлайн хранилище для прогрессивных веб-приложений (Offline Storage for Progressive Web Apps)
  • Что такое API на человеческом языке (What is an API? In English, please.)
  • Что нового в Web Audio? (What’s new in Web Audio?)
  • Улучшаем пользовательский интерфейс с web audio (Jazz up your user interface with web audio)
  
  
• Доступность:
  
  • Делаем доступность великой опять: аудит сайтов кандидатов в президенты США на доступность (Making Web Accessibility Great Again: Auditing the US Presidential Candidates Websites for Accessibility)
  • Начни создавать доступные веб-приложения сегодня. Серия бесплатных уроков на egghead (Start Building Accessible Web Applications Today)
  
  
• Производительность:
  
  • Практический пример по ускорению клиентской производительности (A Case Study on Boosting Front-End Performance)
  • HTTP/2 делает загрузку медиа файлов на мобильных устройствах в 3-15 раз быстрее (HTTP/2 makes media loading 3–15 times faster on mobile)
  
  
• Анимация:
  
  • Мыльные пузыри на SVG
  • Сравнение различных техник веб-анимации на примере прыгающего мячика (Comparing web animation techniques by showing how to bounce a ball with each one)
  • Когда использовать Web Animations API (When to Use the Web Animations API)
  • Анимация олимпийских колец с gsap (Olympic Rings)
  • Забавная интерактивная форма отзыва покупателя (для магазина животных)
  • Презентация нового типа анимации в Isotope — Staggering Animations
  
  
• Генераторы:
  
  • Staticman — приложение на Node.js, загружающее пользовательский контент в репозиторий GitHub. На практике это позволяет вам иметь динамический контент, типа комментариев под постом в блоге, как часть статического сайта на Jekyll
  • Настройка живого руководства по стилю в Jekyll (Setting up a Living Styleguide in Jekyll)
  • nucleus — генератор стилей на nodejs. Приложение парсит SCSS файлы и берет информацию из аннотаций DocBlock
  
  

CSS

• Как по маслу, или анимируем со скоростью 60 FPS на CSS 3
• Трёхпозиционный checkbox (aka tristate) без скриптов и смс
• Полезные соображения насчет курсоров по умолчанию
• Готов ли уже Houdini? (Is Houdini ready yet?)
• Bootstrap vs Foundation – топ 2 CSS фреймворка
• Использование Feature Queries (supports) в CSS (Using Feature Queries in CSS)
• Вы можете изобрести свой собственный странный язык с помощью атрибутов и их селекторов (You can kinda invent your own weird design language with attributes and attribute selectors)
• Предложенное свойство box-suppress (The proposed box-suppress property)
• Свойство `font-display` для масс (`font-display` for the Masses)
• Анимация увеличения фоновых изображений (Zooming Background Images)
• Новая техника для гибкой типографики, позволяющая манипулировать размерами в заданном промежутке (Flexible typography with CSS lock)
• Как создать макет с CSS Grid Layouts (How to create a simple layout with CSS Grid Layouts)
• Тридцать один способ сокращения времени на ручное кросс-браузерное тестирование (31 Ways to Spend Less Time on Manual Cross–Browser Testing)
• Шпаргалка по стилями для React Native (React Native Styling Cheat Sheet)
• UnCSS Online! — сервис убирающий неиспользуемый CSS-код (UnCSS Online!)
• Harry Roberts | CSS для программистов и для CSS разработчиков | CSS Day 2016 (Harry Roberts | CSS for Software Engineers for CSS Developers | CSS Day 2016)

JavaScript

• Прогрессивная загрузка web-приложения с помощью разделения кода
• JavaScript: где мы сейчас и куда двигаться
• JavaScript выходит за пределы Web в 2015 году
• Зачем нам jQuery?
• Да, вы должны изучить ванильный JavaScript перед тем, как иметь дело с js фреймворками (Yes, You Should Learn Vanilla JavaScript Before Fancy JS Frameworks)
• Полируем JavaScript код: избавляемся от старых хаков ES5 (часть 2) (Make your JavaScript code shine: knockout old ES5 hacks (Part 2))
• Живой урок погружения в ES2015 (A Live Lesson in Diving into ES2015, with Darin Haener)
• Быстрый совет: что такое factory функции в JavaScript (Quick Tip: What Are Factory Functions in JavaScript)
• Загадочная и таинственная монада Maybe в JavaScript (The Marvellously Mysterious JavaScript Maybe Monad)
• Скорость загрузки и выполнения маленьких модулей (The cost of small modules)
• Укрощение цепочек промисов с глубоким вложением (Untangling Deeply-Nested Promise Chains)
• 100+ эмуляторов, написанных на JavaScript (100+ Emulators Written in JavaScript)
• Демо с распознаванием нарисованных цифр, использующее GPU и нейронную сеть (GPU Deep Learning Demo)
• Введение в Service Workers (An Introduction to Service Workers — JS Monthly London)
• Уходим в оффлайн с Service Workers (Emanuel Kluge: Go Offline with Service Workers — JSUnconf 2016)
• JavaScript электроника на Pi Zero (JavaScript Electronics on the Pi Zero — Async Brighton)
• Фреймворки:
  
  • Работа с Redux: введение
  • Aurelia 1.0: как создать простое приложение с авторизацией (Aurelia 1.0: How to build a simple secured application)
  • Пишем JavaScript фреймворк — оценка кода песочницы (Writing a JavaScript framework — Sandboxed code evaluation)
  • Восход функционального программирования и закат Angular 2.0 (The rise of functional programming & the decline of Angular 2.0)
  • Remy Sharp: что такое React?
  • React для дизайнеров (React for designers)
  • react-roadmap — дорожная карта изучения React (react-roadmap — a curated list of free resources to master React Development)
  • Представление React Native Ubuntu (Introducing React Native Ubuntu)
  • Архитектура React Fiber (React Fiber Architecture)
  • Десять обязательных для изучения функций RxJS с примерами (10 Need-to-Know RxJS Functions with Examples)
  • Все о $q и промисах в Angular (All about $q and Promises in Angular)
  • От ng-controller к классам компонентов (From ng-controller to Component Classes)
  
  
• Плагины и библиотеки:
  
  • WAUD.JS — библиотека для работы с Web Audio с фоллбеком до HTML5 аудио
  • hy-phen — библиотека для выставления дефиса при переносе слов
  • Papa Parse — мощный парсер CSV (Papa Parse — the powerful, in-browser CSV parser for big boys and girls)
  • react-dates — доступная, готовая к переводам, оптимизированная под мобильные библиотека для выбора дат в React-приложениях
  • Recharts — библиотека для построения компонуемых графиков для React (Recharts — a composable charting library built on React components)
  
  

Браузеры

• Спасти рядового Edge: новый план Microsoft
• Mozilla экспериментирует с добавлением в Firefox средства для обмена скриншотами
• Из Firefox 47+ удалена поддержка colspan=0
• В Google Chrome для Android появятся рекомендации
• Баг в Chrome и Firefox позволял подменить URL, используя арабские символы
• Почему я так и не смог начать пользоваться Microsoft Edge
• WebVR 1.0 появилась в Firefox Nightly (WebVR 1.0 available in Firefox Nightly)
• Странные браузеры @ Webworker NRW — презентация Niels Leenheer о мире существующих браузеров
• Google и Microsoft повышают ставки на HTML5 в браузерах (Google and Microsoft beefing up HTML5 bet for browsers)

Новости и занимательное

• Facebook выложил в открытый доступ исследования в области искусственного интеллекта
• Презентация высокопроизводительной микроархитектуры Zen, или как AMD испортила праздник на улице Intel
• Вред соперникам и пользователям: Антивирус Касперского обманывал конкурентов, «заражая» безопасные файлы: Reuters
• Веб-разработка: поезд ушел, а пассажиры остались? Обширное исследование рынка веб-разработки в 2016 году от Рейтинга Рунета & CMS Magazine.
• Лучшее с Gamescom 2016: косплей
• Мнение Дурова о редизайне ВКонтакте и ответ разработчиков
• Intel анонсировала шлем, который совмещает виртуальную и дополненную реальность
• Пять лет без Джобса: глава Apple Тим Кук говорит о будущем и проблемах компании
• Почему Windows так и не стала лидирующей мобильной платформой
• Как полностью исчезнуть из интернета (инфографика)
• Стажировка в Facebook: зарплата, льготы, бесплатное жилье и доступ к любому проекту
• Вот твоя жизнь в Силиконовой долине (This is Your Life in Silicon Valley)
• Mozilla занимается ребрендингом (Mozilla Open Design branding without walls)

Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.

» Дайджест за прошлую неделю.
» Материал подготовили dersmoll и alekskorovin.