Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
•
Подкаст «Веб-стандарты», Выпуск №87 – Зачем вообще Edge, новинки Safari, бета Chrome 62, кому нужен CoffeeScript 2, идеи для DevTools.
• Подкаст «Frontend Weekend» #20 – Павел Ловцевич о том, как нетворкинг на конференции помогает переехать за границу
• 
Подкаст «Пятиминутка Angular» #4: Meetups (Ekb, Msk), Angular 5 beta7, Angular CLI 1.4, Schematics, Forms
• Подкаст «Пятиминутка React» #36: Ring UI от JetBrains. Интервью с Евгением Датским, ведущим разработчиком библиотеки
• Подкаст «Фронтенд Юность (18+)» #19: Майним биткоины на сайте с помощью пользователей
• Подкаст «devschacht»: Ночной фронтенд #4 — FrontTalks 2017
• Подкаст «devschacht»: Ночной фронтенд #5 — От атомной бомбы до персонального компьютера
• Подкаст «Drinkcast», Выпуск #9: «Сколько нужно программистов, чтобы очистить код»
• «ALL YOUR HTML» #: 15«Плавные переходы между страницами с Barba.js (PJAX)»
•
Microsoft Edge Web Summit 2017, 14 видео
•
Зачем нужен БЭМ. Следуете ли вы БЭМу, и насколько он востребован вне Яндекса?
• Как создать маску ввода для мобильных устройств
• В WordPress рассматривают агностичный подход к выбору JS-фреймворка для блоков Gutenberg
• Какие метатеги использовать в вебе в 2017 году
• Мега-шпаргалка по HTML5
• Сенсоры для веба! Разработчики из Intel в блоге Google делятся своими мыслями о возможностях Generic Sensor API
• Автомат Руба Голдберга. Введение в постмодернизм веб-разработки. Заметка, вдохновленная посещением CSS-Day Amsterdam 2017
• Кастомные свойства. Зачем нужны кастомные свойства и как они работают?
• Явный контроль над специфичностью в CSS?
• Исторический взгляд на FOUT и FOIT от Zach Leatherman
• Как новые шрифтовые технологии (вариативность и параметричность) улучшат веб в будущем
• Как Safari работает с пользовательскими свойсвами CSS
• Написание CSS с мыслями о доступности
• Выводим линтинг CSS на следующий уровень с помощью Stylelint
• Интригующий четвертый уровень CSS селекторов
• Правда веба: CSS — это не настоящее программирование
• Разработка сайтов под iPhone X. Почти официальное руководство в блоге webkit
• Событие для CSS position:sticky. О том, как событие sticky-change поможет связать стили с JS для создания прилипающих элементов наиболее нативным способом
• Angular vs. React vs. Vue: Сравнение 2017
• Как работает JS: управление памятью, четыре вида утечек памяти и борьба с ними
• 
Шпаргалка по современному JavaScript
• JavaScript C++: Современные способы использования C++ в JavaScript проектах
•
В Chrome будет принудительно включаться HTTPS для доменов .dev и .foo
• Будущие обновления Audio/Video в Chrome 62
• Chrome 62 Beta: API для предсказания качества сети, вариативные OpenType шрифты и захват медиа с элементов DOM
• Технические детали Safari Technology Preview 40: поддержка WebAssembly, CSS stroke, Resource/Perf/User timing 2, новые экспериментальные фичи
• Майнить криптовалюту можно прямо через браузеры пользователей. Это уже делают Pirate Bay и хакеры
• Google определила самый небезопасный веб-браузер
• Майнинг криптовалюты через браузер. Сколько на этом можно заработать?
• Googlebot всё ещё не сканирует HTTP/2
• Капитализация Apple снизилась почти на $50 млрд за 10 дней после презентации новых iPhone
• Хакеры взломали популярнейший «чистильщик» CCleaner и использовали его для распространения вредоносного ПО
• Как Apple обманула пользователей насчет «дифференциальной безопасности»
• Stack Overflow выпустила новую версию зарплатного калькулятора
• GitHub объявила о выходе из беты приложения GitHub Desktop
• Google приобретёт часть мобильного бизнеса HTC за $1,1 млрд
• Создатель смайлика Скотт Фалман: «Это самая „ботанская“ штука на свете!»
• iOS 11 достигла более 6% пользователей всего интернета всего за два дня
• Дэн Абрамов: что я выучил после работы в Facebook за почти два года?
?
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Медиа | Веб-разработка | CSS | Javascript | Браузеры | Занимательное
Медиа
•
Подкаст «Веб-стандарты», Выпуск №87 – Зачем вообще Edge, новинки Safari, бета Chrome 62, кому нужен CoffeeScript 2, идеи для DevTools.•
Подкаст «Frontend Weekend» #20 – Павел Ловцевич о том, как нетворкинг на конференции помогает переехать за границу •
Подкаст «Пятиминутка Angular» #4: Meetups (Ekb, Msk), Angular 5 beta7, Angular CLI 1.4, Schematics, Forms•
Подкаст «Пятиминутка React» #36: Ring UI от JetBrains. Интервью с Евгением Датским, ведущим разработчиком библиотеки•
Подкаст «Фронтенд Юность (18+)» #19: Майним биткоины на сайте с помощью пользователей•
Подкаст «devschacht»: Ночной фронтенд #4 — FrontTalks 2017•
Подкаст «devschacht»: Ночной фронтенд #5 — От атомной бомбы до персонального компьютера•
Подкаст «Drinkcast», Выпуск #9: «Сколько нужно программистов, чтобы очистить код»•
«ALL YOUR HTML» #: 15«Плавные переходы между страницами с Barba.js (PJAX)» •
Microsoft Edge Web Summit 2017, 14 видео
Веб-разработка
•
Зачем нужен БЭМ. Следуете ли вы БЭМу, и насколько он востребован вне Яндекса?• Как создать маску ввода для мобильных устройств
• В WordPress рассматривают агностичный подход к выбору JS-фреймворка для блоков Gutenberg
• Какие метатеги использовать в вебе в 2017 году
•
Мега-шпаргалка по HTML5•
Сенсоры для веба! Разработчики из Intel в блоге Google делятся своими мыслями о возможностях Generic Sensor API•
Автомат Руба Голдберга. Введение в постмодернизм веб-разработки. Заметка, вдохновленная посещением CSS-Day Amsterdam 2017- Новости:
• Facebook объявил о перелицензировании React, Jest, Flow и Immutable.js
• Консорциум W3С утвердил средства DRM для Web в качестве стандарта
• Релиз CoffeeScript 2: поддержка современного синтаксиса JS, async, модули, JSX и многое другое
• Vue.js 3 и другие главные новости после Q&A события с разработчиками Vue
- Инструменты:
• Изучите, как отладить JavaScript с помощью Chrome DevTools
• Простой, быстрый и удобный инструмент для коммуникации между дизайнером и клиентом/разработчиком
• Генераторы кода, полезные для разработки шаблонов HTML писем
• Как я урезал вдвое размер своей Webpack сборки
- Производительность:
• Метрики производительности. Чем измерять, на какие значения обращать внимание и как повышать скорость загрузки
• «Вам говорили, что серверный рендеринг вашего JS фреймворка повысит производительность. Но так ли это?»
• Разработчик из NerdWallet подробно о том, как они оптимизировали шрифты на сайте
• Hacker News Progressive Web Apps. Addy Osmani о прогрессе работы над проектом HNPWA, цель которого — продемонстрировать, как PWA можно имплементировать на различных JS фреймворках
- Анимация:
• Еженедельная подборка красивых эффектов на CSS/SVG/JS #54
• Идеи для морфинга органических SVG фигур
• Начинаем работать с Web Animations Api
CSS
•
Кастомные свойства. Зачем нужны кастомные свойства и как они работают?• Явный контроль над специфичностью в CSS?
•
Исторический взгляд на FOUT и FOIT от Zach Leatherman•
Как новые шрифтовые технологии (вариативность и параметричность) улучшат веб в будущем•
Как Safari работает с пользовательскими свойсвами CSS•
Написание CSS с мыслями о доступности•
Выводим линтинг CSS на следующий уровень с помощью Stylelint•
Интригующий четвертый уровень CSS селекторов•
Правда веба: CSS — это не настоящее программирование•
Разработка сайтов под iPhone X. Почти официальное руководство в блоге webkit•
Событие для CSS position:sticky. О том, как событие sticky-change поможет связать стили с JS для создания прилипающих элементов наиболее нативным способом
JavaScript
•
Angular vs. React vs. Vue: Сравнение 2017•
Как работает JS: управление памятью, четыре вида утечек памяти и борьба с ними•
Шпаргалка по современному JavaScript•
JavaScript C++: Современные способы использования C++ в JavaScript проектах- ES2015+:
• ECMAScript 6. Регулярные выражения с поддержкой Unicode
• Наконец стал доступен Promise.prototype.finally()
• Топ 5 функций в JavaScript ES6, которые стоит освоить
• Топ 10 функций ES6 в примерах
• JavaScript декораторы
VueJS:
• Почему Эван Ю считает, что JS-фреймворк Vue будет хорошим выбором для WordPress
• AMA-сессия (вопрос-ответ) на hashnode.com, где команда Vue.js отвечала на вопросы пользователей
• Грядущие изменения TypeScript во Vue 2.5
• Как создать фильтры на Vue.js, с примерами
• Как создать корзину на Vue 2 и Vuex
• 6 случайных JS задачек и их решения на VueJS
• Продвинутая анимация во Vue.js
React:
• Как рисование на чистом CSS помогло мне понять React-компоненты
• Проблемы с Redux: могут ли React, MobX и Realm спасти нас?
• Руководство по тестированию React компонентов
• Обновление лицензции React – что это означает для React разработчиков?
• Redux или нет: искусство управлением состоянием в React приложениях
Angular:
• Обработка Route параметов в Angular v2+
• Прошлое, настоящее и будущее Angular CLI
• Angular & Redux
• Релиза Angular 5 немного задерживается
- Libs & Plugins:
• vuetify — фреймворк компонентов с Material-дизайном для Vue.js 2
• ngraph.path — нахождение пути в графе
• nanoevents — простая библиотека для работы с событиями
• bosket — коллекция компонентов, отображающих древовидные структуры для фреймворков React, Angular, VueJS, RiotJS
• winamp2-js — реализация Windamp 2.9 на HTML5 и JS
Браузеры
•
В Chrome будет принудительно включаться HTTPS для доменов .dev и .foo•
Будущие обновления Audio/Video в Chrome 62•
Chrome 62 Beta: API для предсказания качества сети, вариативные OpenType шрифты и захват медиа с элементов DOM•
Технические детали Safari Technology Preview 40: поддержка WebAssembly, CSS stroke, Resource/Perf/User timing 2, новые экспериментальные фичи• Майнить криптовалюту можно прямо через браузеры пользователей. Это уже делают Pirate Bay и хакеры
• Google определила самый небезопасный веб-браузер
• Майнинг криптовалюты через браузер. Сколько на этом можно заработать?
Занимательное
• Googlebot всё ещё не сканирует HTTP/2
• Капитализация Apple снизилась почти на $50 млрд за 10 дней после презентации новых iPhone
• Хакеры взломали популярнейший «чистильщик» CCleaner и использовали его для распространения вредоносного ПО
• Как Apple обманула пользователей насчет «дифференциальной безопасности»
• Stack Overflow выпустила новую версию зарплатного калькулятора
• GitHub объявила о выходе из беты приложения GitHub Desktop
• Google приобретёт часть мобильного бизнеса HTC за $1,1 млрд
• Создатель смайлика Скотт Фалман: «Это самая „ботанская“ штука на свете!»
•
iOS 11 достигла более 6% пользователей всего интернета всего за два дня•
Дэн Абрамов: что я выучил после работы в Facebook за почти два года??
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Комментарии (4)
aleksand44
25.09.2017 22:44"Правда веба: CSS — это не настоящее программирование".
Проиграл с заголовка.
ReklatsMasters
Про тестирование WebAssembly интересно. Но меня, если честно, удивили результаты. По моим предыдущим тестам выходило, что WebAssembly довольно медленный. Решил проверить последний тест,
sha256, т.к. на мой взгляд он самый честный, потому что использует операции работы с памятью, а не простую математику. Вот мои результаты, в которые я включил вычисления с помощью внутреннего модуляcrypto, а также результаты с помощью портированной мной библиотеки Nettle (windows 10, i5 4690):И тут у меня возникают вопросы к автору и вообще корректности его тестов. Как он так умудрился замедлить в ~3 раза нативный вариант? Каким образом его Web Assembly медленнее на 3,5к операций?
А вот результаты на Microsoft`овском движке chakracore (использовался node-chakracore):
И тут я удивлён тем, что у Web Assembly результаты реально выше, чем в V8. В общем, если интересно, могу сделать пару статей про Web Assembly по своим примерам.