Дайджест свежих материалов из мира фронтенда за последнюю неделю №306 (12 — 18 марта 2018)19.03.2018 06:33

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

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

Медиа

• Подкаст «Frontend Weekend» #44 — Константин Буркалев о создании SDCast и RadioJS и о том, как начать свой подкаст с нуля
• Подкаст «Пятиминутка React» #42 — Джейк Арчибальд: В петле (JSConf.Asia 2018)
• Подкаст «devschacht»: Ночной фронтенд #26 — Дебаты о статической типизации
• Подкаст «Фронтенд Юность (18+)» Лёха в гостях у uWebDesign
• Подкаст «Drinkcast» jn SPB Frontend, «Грустный», о выгорании на работе
• «ALL YOUR HTML» #40: «Decompiled animation from murmure.me website»

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

• Простой статический сайт на Webpack 4
• CloudFlare представила стабильный релиз Workers для облачного администрирования веб-приложений на JavaScript
• Изучаем Bootstrap 4 за 5 минут
• Опрос Stack Overflow 2018: ИИ, этика и сексуальная ориентация

• Производительность:
  • 4 полезные подсказки по оптимизации изображений
  • Почему производительность имеет значение. Заметка Jeremy Wagner в блоге разработчиков Google
  • Как тестировать кастомную скорость соединения с помощью GTmetrix
  • Улучшение производительности в 10 раз: оптимизация статического сайта
  • Accelerated Mobile Pages: повышаем уровень конверсии
  • Как интерактивный контент BBC работает в AMP, приложениях и вебе
  

• Инструменты:
  • Ускорение сборки JavaScript-кода с использованием webpack 2–3
  • Если вы когда-либо конфигурировали Webpack, Parcel снесет вам крышу!
  • Continuous Development без нажатия Ctrl + R с помощью webpack 4
  • emma-cli — вспомогательный терминал для нахождения и установки node пакетов.
  

• Accessibility:
  • Как вы можете сделать ваш сайт более доступным
  • Одностраничные приложения не доступны
  • Подробный план по работе с веб-доступностью
  • Полезные ресурсы на тему доступности
  • Labels Required. Обстоятельная статья на filamentgroup о том, почему так важно использовать label
  

• Анимация:
  • Еженедельная подборка красивых эффектов на CSS/SVG/JS #73
  • Слайдшоу с глитч-эффектом
  • Необычный концепт анимации ссылок
  

CSS

• Font (ещё более) Awesome — знаковое изобретение
• Анимация без стереотипов
• CSS в эпоху React: как мы променяли каскад на согласованность
• CSS Grid Application Layout на продакшене
• В блоге разработчиков Microsoft анонсировали скорую поддержку вариативных шрифтов в Microsoft Edge
• Ресурс для поиска и тестирования вариативных шрифтов
• Темизация с помощью переменных, глобальных и локальных
• Магия ванильного CSS с помощью пользовательских свойств

JavaScript

• Руководство по SEO JavaScript-сайтов: Часть 1. Интернет глазами Google, Часть 2. Проблемы, эксперименты и рекомендации
• Подводные камни Service Workers
• Как сделать Drag-and-Drop загрузчик файлов на чистом JavaScript
• Три года с Angular и не жалею: обзор возможностей фреймворка
• Сравнение главных JavaScript фронтенд фреймворков по состоянию на 2018
• JavaScript vs. TypeScript vs. ReasonML
• SmooshGate: продолжающаяся борьба между прогрессом и стабильностью в JavaScript
• 17 советов для написания производительного кода в JavaScript / node.js чтобы сделать ваши приложения быстрее
• Вы можете создать нейронную сеть на JavaScript даже если вы на самом деле не понимаете нейросети
• Подборка полезных советов и хитростей из ECMAScript 2015 (ES6)
• MobX 4: лучше, проще, быстрее, меньше

• Теория:
  • Как работает JS: отслеживание изменений в DOM с помощью MutationObserver
  • Как заменить все одинаковые подстроки в строке на JavaScript
  • Приведение типов в JS. Магия или простые правила?
  • Элегантные шаблоны в современном JavaScript: Ice Factory
  

• VueJS:
  • Хуки жизненного цикла Vue.js
  • 4 клевые вещи, которые вы можете делать с Vue.js CLI
  • Использование JSX с Vue и почему вас должно это волновать
  • Boiler — javascript фреймворк, использующий Vue и Sass
  • vue-promise-btn — минималистичный, но мощный плагин для блокировки кнопок при выполнении асинхронных действий со встроенным спиннером
  

• React:
  • React Tutorial: подробное руководство по изучению React.js в 2018
  • Reselect — библиотека селекторов для Redux
  • Серверный рендеринг с помощью React и React Router
  • Как GraphQL заменяет Redux
  • Как не делать React: популярные антипаттерны и находки в React
  • React Authentication в деталях
  • Почему разработчики на React должны модулизировать их приложения?
  

• Libs & Plugins:
  • Rough.js — создание графики со скетч-эффектом в канвасе
  • driver.js — легкий движок без зависимостей для привлечения внимания пользователя при взаимодействиях со страницей
  • filepond — продвинутая библиотека для выгрузки разных типов файлов
  

Браузеры

• Релиз Firefox 59, подробности для разработчиков в блоге Марата Таналина
• В Google Chrome появится экспорт паролей
• В Firefox начнут бороться со всплывающими элементами страниц
• «Яндекс» выпустил «Яндекс.Браузер» со встроенной «Алисой»

Занимательное

• Когда появится следующий большой язык программирования с точки зрения Дарвина
• Каково это — работать в IT, если вам за 50
• Google начнёт блокировать рекламу криптовалют и ICO
• Скрытые майнеры распространяют через форки различных проектов на GitHub
• 23 сайта для практики хакинга
• Почему полезно читать любые отзывы пользователей
• Почему в Google сложно получить повышение и иногда проще уволиться
• Google открыла Google Maps API для игровых разработчиков
• Крупные американские компании больше не нуждаются в собственных дата-центрах и продают их Microsoft, Google и Amazon
• Голосовая помощница «Алиса» научилась управлять компьютером на Windows


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

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

© Habrahabr.ru