Дайджест свежих материалов из мира фронтенда за последнюю неделю №219 (4 — 10 июля 2016)

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

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

• Важные аспекты работы браузера для разработчиков. Часть 2
• Подкаст Веб-стандарты, Выпуск №23: HTML 5.1, Dreamweaver, Гудини, ссылки, безопасность и наставничество.
• Как эмодзи могут улучшить ваш код — серьёзно
• Улучшение путей взаимодействия пользователя (user flow) через переходы по странице
• Запись трансляции Летнего Я.Субботника, секция Фронтенд
• Фронтенд разработка в мире интернета вещей (Front-End Development in an Internet of Things World)
• Планируемый requestAnimationFrame для ботанов (requestAnimationFrame Scheduling For Nerds)
• Что такое прогрессивное веб-приложение, и должен ли я его создавать (What’s a Progressive Web App, and Should I Build One?)
• Осведомленность фронтенд разработчика (A Front End Developer is Aware)
• Сложности бесконечного скроллера (Complexities of an infinite scroller)
• Жизненный цикл Service Worker, один из уроков бесплатного курса Offline Web Applications на udacity
• Десять требований по созданию каруселей на главной странице (Ten Requirements For Making Home Page Carousels Work For End Users (If Needed))
• Мысли о HTML5 (Thoughts on HTML5)
• Отзывчивые изображения: меньший вес страницы с элементом picture и WebP (Responsive images: Smaller page sizes with the picture element and WebP)
• Кросс-браузерность: Делайте веб работающим для всех (Make the Web Work For Everyone)
• Доступность:
  • Как правильно использовать альтернативный текст (Writing for all people: how to use alternative text well)
  • Всегда используйте label (Always use a label)
  • Поля для поиска без label (Unlabelled search fields)
  • Подробно о доступности SVG (Accessible SVGs)

• Инструменты:
  • 10 вещей, которых вы не знали о WebPageTest.org
  • Webpack: представление команды и призыв к поддержке проекта (webpack: It’s getting real)

• Эффектный веб:
  • Техники манипулирования изображениями в Canvas (Canvas image manipulation techniques)
  • Простая анимация статики в Canvas (Animating Static in HTML5 Canvas)
  • Визуализация отрисовки элементов на WebGL в замедленном режиме
  • Еженедельная подборка красивых эффектов на CSS/SVG/JS #45

CSS

• Относитесь к сеткам (на флексбоксах) проще. Перевод статьи Don’t Overthink It (Flexbox) Grids
• Битва архитектур. Перевод статьи Battle of the architectures
• Современный CSS мощнее, чем вам кажется: N примеров, в которых вам не нужен JavaScript
• Компоненты интерфейса, созданные без JS (You Don't Need JavaScript)
• Довольны ли вы своими CSS файлами в ваших больших приложениях? Атака на CSS методологии (Happy with your CSS files in your big app? OOCSS, BEM, SMACSS, ITCSS, ACSS, ITCSS under attack.)
• Структурирование CSS для больших проектов (Structuring CSS in large projects)
• Создаем пользовательский курсор ввода (Creating a custom input cursor/caret)
• Front-End вызов принят: CSS 3D Куб (Front-End Challenge Accepted: CSS 3D Cube)
• Трюки с :target (The :target Trick)
• CSS: идеальные стили для печати (CSS: The Perfect Print Stylesheet)
• Создаем динамические темизирующиеся сайты с помощью C:WorkGitHubdigest16-07-10_.html (Creating dynamically theme-able websites using CSS currentColor)
• Являются ли проценты viewport доступными единицами? (Accessibility of viewport percentage units)
• Воссоздание анимационного эффекта Twitter Heart (с помощью одного HTML-элемента, без изображений и JavaScript) (Recreating the Twitter Heart Animation (with One Element, No Images, and No JavaScript))
• CssToReact — простой маленький инструмент, позволяющий транслировать CSS в специфический инлайновый JSON для React
• ress — современный сброс стилей (ress — a modern CSS reset)
• < LINK > Видео доклада Yoav Weiss c HTML Special, CSS Day

JavaScript

• Бесплатные игровые движки на HTML5 и JavaScript
• Да. JavaScript восходит (Yes. JavaScript rises)
• Релиз jQuery 3.1.0 – больше никаких тихих ошибок
• Релиз ESLint v3.0.0 (ESLint v3.0.0 released)
• Предупреждение по поводу jQuery 3 (A Warning About jQuery 3)
• Трюки консольной отладки (Beyond Console Debugging Tricks)
• Введение в функциональное программирование на JavaScript, ч.1 (Introduction to Functional Programming in JavaScript (Part 1))
• You-Dont-Need-Lodash-Underscore — список JS методов, которые можно использовать нативно (без Lodash или Underscore) (You-Dont-Need-Lodash-Underscore — lists of Javascript methods which you can use natively)
• Как создать нейрон: исследование ИИ в JavaScript, часть 2 (How to Build a Neuron: Exploring AI in JavaScript Pt 2)
• Три трюка для лучшей работы с npm модулями (3 tricks to better handle npm modules)
• Заимствование методов в JavaScript (Borrowing Methods in JavaScript)
• Отслеживание GPS информации с Tessel 2 (Tracking GPS data with the Tessel 2)
• Три отличных совета по отладке JavaScript в DevTools (3 Splendid JavaScript Debugging Tips)
• ES6:
  • Понимание ES6 модулей через их историю (Understanding ES6 Modules via Their History)
  • ES6 для людей (ES6 for Humans)
  • Выживание в ECMAScript 6 (Surviving ECMAScript 6)

• Фреймворки:
  • Вы можете не захотеть использовать [хипстерский_js_фреймворк] (You may not want to use [hip_js_framework])
  • Написание JavaScript фреймворка — структура проекта (Writing a JavaScript Framework — Project Structuring)
  • 6 уроков, которые я получил, перейдя на продакшен с React-Redux (6 lessons learned from going to production with React-Redux)
  • Лучшие практики для React и Flux на продакшене (React and Flux in Production Best Practices)
  • racket — стартовый пакет с React/Redux веб приложениями и генераторами
  • Функциональные компоненты с React stateless функциями и Ramda (Functional Components with React stateless functions and Ramda)
  • Особенности React (React Gotchas)
  • Начало работы с React, GraphQL и Relay (часть 1 из 2) (Getting Started with React, GraphQL and Relay (Part 1 of 2))
  • Создание мобильного приложения с Angular 2 и Ionic 2 (Build a Mobile App with Angular 2 and Ionic 2)

• Плагины:
  • zingtouch — библиотека для определения жестов (zingtouch — a JavaScript gesture detection library for the modern web)
  • Segment — небольшой JS класс для рисования и анимации SVG кривых (Segment — a little JavaScript class (without dependencies) to draw and animate SVG path strokes)
  • ejs — эксперимент с window.onerror, упрощающий отладку JavaScript
  • Fela — библиотека для работы с динамическими стилями в JavaScript (Fela — Fast & Dynamic Styling in JavaScript)
  • 10 jQuery плагинов для загрузки файлов (10 jQuery File Upload Plugins)

Браузеры

• Context Graph в Firefox будет подсказывать пользователям на какой сайт пойти дальше
• В браузере Chrome появилась поддержка потоковой трансляции изображения на телевизоры
• В Chrome добавлены средства шифрования, стойкие к подбору на квантовом компьютере
• Как в Chrome избавиться от прыжков страницы во время загрузки изображений
• Покупателю Yahoo придётся выплатить Mozilla $1 млрд за использование поисковика в Firefox
• Новости браузера UC
• Будущее «Истории» в браузерах (The Future of Browser History)

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

• eBay анонсировал, что теперь они обсуживают более 8 млн. страниц, используя AMP
• Google работает над доступностью любого сайта в VR (Google is working to make every website viewable in VR)
• Facebook блокирует крупные страницы за ссылки на сайты с социальным замком
• Google купил платформу дистрибуции видео Anvato, пользователи ожидают ее интеграции с YouTube
• 32 бита всё
• Почему если все уйдут в IT, станет только хуже
• Исходный код Apollo 11 полностью опубликовали на GitHub, программисты обсуждают баги
• Несмотря на более низкие скидки в этом году, распродажа в Steam прошла более успешно
• Путин подписал закон Яровой о хранении и расшифровке данных пользователей
• Хронология продажи LinkedIn: Предложения от Google, Facebook, Microsoft и других
• Ученые записали в ДНК рекордные 200 мегабайт данных
• Рутина, стресс, недостаток сна и депрессия Сотрудники компаний Кремниевой долины поделились в комментариях на Quora обратной стороной своей работы: бесконечная рутина, недостаток сна, стресс и прочее.
• Улучшаем дизайн форм. Как исправить распространенные ошибки дизайнеров
• Игра, где требуется найти цвет по названию (Find the colour)
• The History of the URL: Domain, Protocol, and Port

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

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

Автор: Zfort Group

Источник