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

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

957fa509758b4167ad693d923529e73c.png

Веб-разработка
CSS
Javascript
Браузеры
Новости

b70f9feaeee78b42a0c78c3731555e73.gif Веб-разработка


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

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

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


36c2c69660dd21085a2dcb71d7246ae6.gif CSS


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

49d04efb96fb6ce31cde9be5dc12a874.gif JavaScript


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

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

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


Браузеры


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

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


  • eneBay анонсировал, что теперь они обсуживают более 8 млн. страниц, используя AMP
  • enGoogle работает над доступностью любого сайта в 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 обратной стороной своей работы: бесконечная рутина, недостаток сна, стресс и прочее.
  • Улучшаем дизайн форм. Как исправить распространенные ошибки дизайнеров
  • enИгра, где требуется найти цвет по названию (Find the colour)
  • enThe History of the URL: Domain, Protocol, and Port

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

UPD: На следующей неделе дайджеста не будет, отпуск, все дела.

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

Комментарии (0)

© Habrahabr.ru