Дайджест свежих материалов из мира фронтенда за последнюю неделю №259 (16 — 23 апреля 2017)

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

cf85d9794f1c48bcbd1fe227ae6aa38f.png

Веб-разработка
CSS
Javascript
Браузеры
Занимательное

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


  • Размышления по поводу невыполненных обещаний веб-компонентов
  • 10 самых разрушительных ошибок в мобильном SEO
  • Датчики внешней освещённости могут использоваться для хищения данных из браузера
  • Facebook открыл фреймворки для построения интерфейса: Litho, React Fiber, Relay Modern и React VR
  • Производительность:
    • Техники детального анализа производительноти с помощью Dev Tools в блоге разработчиков Google
    • enПрезентация библиотеки pwmetrics, предназначенной для анализа различных факторов, влияющих на скорость загрузки страницы
    • enПять Lazy Load техник для изображений, для повышения производительности сайта
    • enТестирование производительности — инструменты и Waterfall диаграммы

  • enСлайды и видео с конференции Render 2017: Рабочий процесс в современном фронтенде от Umar Hansa, Как правильно выбирать современные технологии от Jeremy Keith, Начинаем использовать CSS Grid Layouts уже сегодня от Rachel Andrew и другие доклады
  • enЗаписи докладов F8, конференции для разработчиков от Facebook
  • enMega Tags — самый полный генератор социальных мета-тегов
  • enЧто нового на сайте «AMP by Example»: новый дизайн, интерактивная песочница, обновление компонентов и новые примеры
  • enRealWorld — посмотрите, как абсолютно одна и та же платформа для блогинга работает на совсем разных стеках: React/Angular и Node/Rails/Django
  • enSVG слайдер с эффектом морфинга — 20th Century Women
  • enКреативный концепт страницы для разработчика/дизайнера

36c2c69660dd21085a2dcb71d7246ae6.gif CSS


  • Ремы, емы, и почему отказ от них — не проблема
  • enПришло время начинать использовать пользовательские свойства CSS
  • enПереход к стеку системных шрифтов в 2017
  • en8 примеров, как не нужно и как нужно писать CSS селекторы
  • enCSS Grid Layout — новая терминология
  • enШпаргалка по CSS Grid: полное визуальное руководство по гридам
  • enМежду строк — подробно о технике реализации адаптивной типографики и лейаутов
  • enПроблема с атомарным CSS
  • enСоздание устойчивой архитектуры на Sass: часть 2
  • enragrid — базовая сетка на flexbox
  • enКак мы сделали наш продукт более персонализированным с помощью CSS переменных и React
  • enПутешествие к высокоэффективным и поддерживаемым медиазапросам CSS
  • enО состоянии вариативных шрифтов в браузерах на начало 2017-го
  • enИспользование flow-root сегодня

49d04efb96fb6ce31cde9be5dc12a874.gif JavaScripts


  • habrРеволюция в JavaScript. Буквально
  • habrСпособы отладки JS на клиенте
  • habrТрудные уроки: пять лет с Node.js
  • Спецификация Static Land
  • enОбзор JS тестирования в 2017-м
  • enРазбор инструментов для тестирования JavaScript: Sinon.js vs testdouble.js
  • enJavaScript: что волнует меня в 2017
  • enJavaScript: изучение регулярных выражений для новичков
  • enУправляем мышкой и сенсорным вводом с помощью Pointer Events API
  • enCSS в JS. Rockey.
  • Практика:
    • Методы обхода массива
    • enДобавляем комментарий в код: хороший, плохой, безобразный
    • enАдаптивные фоновые изображения с JavaScript
    • enНачинаем работать с Three.js
    • enНачинаем работать с Chart.js: введение

  • ES2016+:
    • habrНативные ECMAScript модули — первый обзор
    • Асинхронные функции 101
    • enAsync итераторы и генераторы
    • enВы нуждаетесь в ES2017 функциях Async Functions. И вот почему…
    • enПришло время овладеть стрелочными функциями

  • React:
    • Facebook готовит к релизу React Fiber, перезапуск JS-библиотеки React·
    • Oculus опубликовала WebVR-библиотеку React VR
    • enСоздаем свой собственный Redux, часть 2: функция connect
    • enReact Move — красивые и изолированные анимации всего в реакте
    • enБыстрый совет: как стилизовать компоненты React с помощью styled-components
    • enВыбираем между React и Angular: глубокое сравнение
    • enИспользование AngularJS компонентов и директив в React
    • enКогда проекту нужден React?
    • enВещи, о которых никто вам не скажет о React.js

  • Vue:
    • enРуководство по аутентификации во Vuejs 2
    • enЮнит тестирование для Vue.js и TypeScript
    • enМощь пользовательских директив в Vue
    • enДавайте создадим веб-приложение с Vue, Chart.js и API
    • enСоздание игры Tic-Tac-Toe Game на Vue 2: часть 2
    • envee-validate — простой плагин для валидации полей ввода для Vue.js

  • Angular:
    • habrВсе, что вам нужно знать об обнаружении изменений в Angular
    • enВопросы для собеседования на позицию Angular разработчика
    • enAngular 2.0 vs Polymer

  • Libs & Plugins:
    • enzuck.js — javascript библиотека, позволяющая добавить истории ВЕЗДЕ
    • enForall.js — Выразительные статические типы и инвариантные проверки JavaScript. Похоже на TypeScript, но с нюансами
    • end3-annotation — добавляение аннотаций к визуализациям
    • enlodash-form-collector — сборщик данных форм на lodash
    • ensimple-slider — простая микро-карусель, 1.2kb
    • enHR.js — плагин для выделения и замены текста в DOM-е


Браузеры


  • Google приписывают намерение встроить функцию блокирования «неприемлемой» рекламы в браузер Chrome
  • Выпуск web-браузера Chrome 58
  • Релиз Firefox 53, плюс подробности для разработчиков
  • Тестирование бета-версии Firefox 54
  • Реструктуризация процесса разработки Firefox и отказ от ветки Aurora
  • enУлучшенная производительность JavaScript, WebAssembly, и Shared Memory в Microsoft Edge
  • enПодробно о том, как переписали DOM в Microsoft Edge

d4b289ef0a00e969108c25d0c3d75f58.gif Занимательное


  • Соцсеть в виртуальной реальности, управление компьютером силой мысли и множество новинок для разработчиков — всё, что Facebook показала на конференции F8 . 8 важных анонсов с конференции Facebook F8 и их значение для маркетологов
  • Google открыла доступ к Cloud Speech API, лежащей в основе Google Ассистента технологии распознавания речи
  • «Даже создатели ИИ не до конца знают, как он работает»: 4 проблемы искусственного интеллекта
  • Mastercard представила биометрическую банковскую карту нового поколения
  • Видео: Григорий Бакунов показал собственного голосового ассистента для автомобиля
  • «Мы не Facebook или Instagram»: сервис Pinterest убрал кнопку Like
  • Google приписывают намерение встроить функцию блокирования «неприемлемой» рекламы в браузер Chrome
  • Илон Маск планирует создать полноценные нейроинтерфейсы для связи мозга с компьютером за 8–10 лет, а продукты для медицины — за четыре
  • Как Reddit создал r/Place
  • Весь гарвардский курс по основам программирования. 23 лекции на русском языке по 40–60 минут
  • Новая версия Google Earth: Земля как на ладони
  • Google Hire — новый сервис для поиска работы
  • Internet Archive запустил онлайн-эмулятор Macintosh

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

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

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

© Habrahabr.ru