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

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

CSS

Javascript

Браузеры

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

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

• HTTP/2 уже здесь но спрайт-сеты ещё не умерли
• 64bit-арифметика в браузере и WebAssembly
• Недоступный веб: как мы развели такой бардак. Перевод статьи The inaccessible web: how we got into this mess
• Ускоряем npm-скрипты
• Подкаст Веб-стандарты, Выпуск №31 : Юбилей WebKit, будущее Firefox, безопасность, PWA, PostCSS, образование, генераторы статики.
• 400 тысяч GitHub-репозиториев, 1 миллиард файлов, 14 ТБ кода: пробелы или табуляция?
• Отчет о прошедшем FrontendFellows в Алматы
• W3C Wiki и W3C specifications теперь используют протокол «путешествия во времени» (Memento at the W3C)
• Разрушение мифов о веб-компонентах (Demythstifying Web Components)
• Как перенести координаты из DOM в SVG и обратно (How to Translate from DOM to SVG Coordinates and Back Again)
• О том, как уменьшить сдвиг контента при загрузке страницы (Ways To Reduce Content Shifting On Page Load)
• Врываемся в процесс: фронт-енд разработка с середины проекта (Jumping in: Front-end development from the middle of the project)
• «Я хочу ввести число». Зак Лезерман о нюансах полей для чисел и их параметрах в контексте цифровых клавиатур (I Wanted to Type a Number)
• Правильное время, чтобы подумать о веб-производительности (When is the Right Time to Think about Web Performance?)
• 11 простых трюков в npm, от которых вы будете в шоке (11 Simple npm Tricks That Will Knock Your Wombat Socks Off)
• Подробная статья о пользовательских элементах, свойствах и вариантах их использования: Part 1, Part 2 (The Case for Custom Elements)
• Осязаемая производительность — в погоне за скоростью по метрикам не забывайте о пользователе (Perceived Performance – Don’t Forget the User)
• Индикация оффлайн состояния (Indicating offline)
• Установка AMP в WordPress
• Slicing SVG 9 Ways
• Глитч-эффект на изображении с помощью HTML5 Canvas
• Вдохновляющие индикаторы навигации

CSS

• CSS Containment
• Невозможная типографика. Перевод статьи Typography is impossible
• Способы смены порядка вывода элементов с помощью CSS
• Разработка независимых расширяемых HTML и CSS компонентов (Developing Extensible HTML and CSS Components)
• Pantsuit: The Hillary Clinton UI pattern library
• Являются ли иконки контентом? (Are icons content?)
• Про Auto в CSS (AtoZ CSS Quick Tip: Auto) (+ скринкаст)
• Объяснение позиционирования в CSS с помощью сливочного мороженого (CSS Positioning Explained By Building An Ice Cream Sundae)
• Mobi.css — легкий фреймворк, ориентированный на мобильные устройства
• Spectre: еще один легкий CSS фреймворк
• Рефакторинг CSS: три «И» (Refactoring CSS: The Three I’s)
• Имлементация на чистом CSS структуры Google Photos / 500px image layout
• Забавы с CSS Pixel Art
• 20 профессиональных советов по написанию современного CSS (20 Protips For Writing Modern CSS)
• Добавление условной логики в Sass c помощью директив контроля (Add Conditional Logic To Sass With Control Directives)
• Математика в новой технике отзывчивой типографики «CSS locks» (The math of CSS locks)
• Обрезка многострочного текста с помощью EQCSS (Responsive Multiline Truncation…)
• Всплывающее в конце страницы окно “Next Article” с помощью EQCSS
• Как создать отзывчивый компонент интерфейса с помощью Element Queries (How to Build a Responsive UI Component Using Element Queries)
• Руководство для новичков по объектной модели CSS (CSSOM) (The Beginners Guide to CSS Object Model (CSSOM))
• Эффект глубины с CSS анимацией (Make a Depth of Field Effect with CSS Animation)
• Конструктор объемных кубов (3d css cubes)

JavaScript

• Новые практические курсы по JavaScript и ES6
• Знакомство с p5.js
• Проверяем скорость работы промисов
• Horizon — realtime JavaScript бэкэнд
• Перевод официальной документации Typescript на русский.
• Предварительные результаты глобального опроса о вкусах JS в среде разработчиков (The State Of JavaScript: JavaScript Flavors)
• Должен ли я учить ES5, ES6 или TypeScript (Should I learn ES5, ES6 or TypeScript)
• Искусство написания маленьких и простых функций (The art of writing small and plain functions)
• JS MythBusters — справочник по оптимизации с высокой точки зрения (An optimization handbook from a high level point of view)
• Заметки с JSConf.IS
• Почему я использую руководство по стилю в JavaScript и почему вы должны тоже (Why I Use a JavaScript Style Guide and Why You Should Too)
• Проблемы со стрелочными функциями в JavaScript (The Troubles with JavaScript Arrow Functions)
• Новые релизы: TypeScript 2.0 RC, Angular 2.0.0-rc.6
• Bloomberg анонсирует BuckleScript 1.0 (Bloomberg announcing BuckleScript 1.0)
• Closure компилятор в JavaScript (Closure Compiler in JavaScript)
• JavaScript производительность через подзорную трубу (GOTO 2016 • JavaScript Performance Through the Spyglass • Vyacheslav Egorov)
• Использование ES2015 Proxy для пользы и развлечения (Using ES2015 Proxy for fun and profit)
• ES предложение: доработка Function.prototype.toString, ES предложение: доработка литерала шаблона
• babili — ES6+ минификатор основанный на Babel (babili — an ES6+ aware minifier based on the Babel toolchain (beta))
• Три базиса производительности JavaScript делающих Bluebird быстрой (Three JavaScript performance fundamentals that make Bluebird fast)
• Ohm: JavaScript парсер, создающий язык в 200 строк кода (Ohm: JavaScript Parser that Creates a Language in 200 Lines of Code)
• Начало работы с Hapi.js (Getting Up and Running with Hapi.js)
• Angular:
  
  • Яков Файн: Что происходит с Angular 2
  • Сканирование баркодов с помощью NativeScript и Angular 2 (Scanning Barcodes with NativeScript and Angular 2)
  • Понимание Binding в Angular
  • От angular.module к ngModule (From angular.module to ngModule)
  • Создание приложения с авторизацией API с Auth0, ExpressJS и AngularJS (Build a secure API with Auth0, ExpressJS and AngularJs)
  • supernova-angular-1.5.x-es6-starter — стартовый пакет с angular > 1.5.x, > es6, karma и jasmine
  
  
• React:
  
  • Webpack + React. Как уменьшить бандл в 15 раз
  • Исследование State Propagation в React
  • Создание приложения c пользовательской авторизацией на React (Build a React App with User Authentication)
  • Как создать React компонент для публикации в NPM? (How to create a React component to publish on NPM?)
  • 5 типов состояния приложения React (The 5 Types Of React Application State)
  • Размышления на тему тестирования React/Redux приложений (Some Thoughts On Testing React/Redux Applications)
  • Создание анимированных компонентов, или как React делает D3 лучше (Building Animated Components, or How React Makes D3 Better)
  • awesome-react-components — курируемый каталог React-компонентов (awesome-react-components — catalog of React components / libraries)
  • Riot — легкая альтернатива Реакту (Reading the Riot Act: Exploring a Lightweight React Alternative)
  
  
• Библиотеки:
  
  • Маска для полей ввода с помощью React, Angular, Ember, & простого JavaScript
  • Cesium — open-source JavaScript-библиотека для объемных карт и глобусов мирового уровня (Cesium — an open-source JavaScript library for world-class 3D globes and maps)
  • react-dates — доступный, легко переводимый, адаптированный под мобильные устройства компонент выбора дат (react-dates — an accessible, easily internationalizable, mobile-friendly datepicker library for the web)
  • postmate — простая, но мощная, основанная на промисах библиотека, использующая postMessage API (postmate — a powerful, simple, promise-based postMessage library)
  
  

Браузеры

• Первый мобильный браузер с поддержкой расширений для Chromium. Новая альфа Яндекс.Браузера
• Выпуск web-браузера Chrome 53
• В Chrome для Android появился менеджер загрузок и сохранение страниц для офлайн-просмотра
• В браузере «Яндекса» исправлен CSRF-баг, позволявший похитить все данные пользователя
• Тренды браузеров сентябрь 2016: закончилась ли война браузеров? (Browser Trends September 2016: Are the Browser Wars Over?)
• В Safari 10 Добавлена поддержка WebDriver (WebDriver Support in Safari 10)
• Microsoft Edge и Continuum: твой браузер настольного компьютера на мобильном устройстве (Microsoft Edge and Continuum: Your desktop browser on Mobile)

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

• Путь к HTTP/2
• Официально представлены процессоры Intel 7-го поколения (Kaby Lake)
• Уже более миллиона IoT устройств входят в состав различных ботнетов
• Google подтвердила приостановку проекта модульного смартфона Project Ara
• История Nexus может закончиться: в этом году смартфоны Google сменят бренд
• Mozilla обсуждает прекращение доверия к удостоверяющему центру WoSign
• Утечка учётных записей 68 млн пользователей Dropbox
• В 2012 году взлом Last.fm привёл к утечке хэшей паролей 43 млн пользователей
• Видеоигры: что делает их затягивающими
• 160 бесплатных онлайн-курсов сентября по программированию и предпринимательству
• Как наука о больших данных меняет образование и делает обучение увлекательным
• Чему я научился работая с командой Джонни Айва над Apple Watch
• Как порнография продвигает технологии в массы
• Экскурсия по музею Intel: 38 лет истории x86 и многое другое
• Примеры кода, синтаксически валидного и одинаково работающего в нескольких языках
• Топ-25 лучших мемов за всю историю интернета: Nyan cat, доге, рикролл и другие
• Опубликована первая открытая альтернативная реализация клиента Skype
• Как придумать хороший пароль?

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

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