Предлагаем вашему вниманию подборку с ссылками на полезные ресурсы и интересные материалы из области фронтенда.
Веб-разработка |
CSS |
Javascript |
Браузеры |
Новости и зЗанимательное |
Веб-разработка
- Подкаст Веб-стандарты, Выпуск №40: Chromium 54, Safari TP16, Mozilla, Servo и разработка движков, таблицы, Node.js 7, стандарты и полифилы, border-image, Дейв Шей про режимы смешивания.
- Видео докладов с конференции FrontTalks, прошедшей 17 и 18 сентября в Екатеринбурге
- Accelerated Mobile Pages. Юрий Матюхин делится своим опытом
- SVG и медиа-запросы
- Chrome, Firefox и Edge перешли на новый этап тестирования технологии WebAssembly
- Пока растр, привет вектор: три способа простого использования SVG
(Bye raster, hello vector: 3 ways to use SVG easier) - Викторина: насколько хорошо вы знаете парсер HTML (HTML parser quiz)
- Bootsrap 4: что нового и что изменилось в Bootstrap 4, а также шпаргалка с именами классов
- Представление FlyWeb — набор новых API от Mozilla для создания локальных веб-серверов и сервисов (Introducing FlyWeb)
- Соединяем виртуальные миры: гиперссылки в WebVR
(Connecting Virtual Worlds: Hyperlinks in WebVR) - Ссылки mailto: пусть пользователь выбирает сам
(Mailto links: Letting the user decide) - Веб — это не модно, или как я научился любить веб
(The Web is not Fashionable. or: How I Learned to Love the Web) - Исследование вьюпортов, часть очередная
(Viewports research, part umpteen) - Какой язык программирования вам следует учить первым?
(What programming language should you learn first? ʇdıɹɔsɐʌɐɾ :ɹǝʍsuɐ) - Производительность:
- 10 принципов для плавной анимации в вебе (10 principles for smooth web animations)
- Перестаньте объединять ваш CSS/JS (Stop Concatenating Your CSS/JS)
- Производительность веба (Web Runtime Performance)
- Доступность:
- Доступность сайтов для самых маленьких
- Инструменты для разработки доступных сайтов (Tools for Developing Accessible Websites)
- 10 вещей, которых не хватает на вашем сайте (10 things your website might be missing)
- Почему семантика имеет значение (Why do semantics matter?)
- Инструменты:
- Опросник по Front-End инструментам – 2016 (Front-End Tooling Survey – 2016)
- Более быстрые и надёжнее CI билды с Yarn (Faster, More Reliable CI Builds with Yarn)
- RFC: бюджет производительности Webpack (RFC: Webpack Performance Budgets)
- webpack-bundle-analyzer — визуализатор содержимого бандла (webpack-bundle-analyzer — Webpack plugin and CLI utility that represents bundle content as convenient interactive zoomable treemap)
- Эффектные медиа-попапы (Artsy Media Pop Up Effect)
- Создаем прогресс-бар с радиальным заполнением (Making a Doughnut Progress Bar )
CSS
- Анонсируем Dart Sass
- Веб-шрифты, ребята, ну я даже не знаю (Web fonts, boy, I don't know)
- Как и почему вы должны инлайнить критический CSS
(How and Why You Should Inline Your Critical CSS) - Вещи, которые я узнал о CSS Grid Layout (Things I’ve Learned About CSS Grid Layout)
- [ИТ-лекторий]: Стандарт СSS: как и для чего он был придуман?
- CSS Motion Path по состоянию на октярь 2016
- Блог webkit: Изменчивые шрифты в вебе (Variable Fonts on the Web)
- Современный сброс CSS (с оговорками) (A modern CSS reset (with caveats))
- 8 простых правил для надежной, масштабируемой архитектуры CSS
(8 simple rules for a robust, scalable CSS architecture) - Архитектура фронтенда, часть 2: брендовые переменные
(Front-end Architecture: Part 2 — Brand Variables) - Как построить отзывчиваю сеточную систему (How to build a responsive grid system)
- О семантических именах классов (Semantic class names: are you being too generic?)
- Пост-процессоры CSS для начинающих: советы и ресурсы
(CSS Post-Processors For Beginners: Tips and Resources) - Континуум Q: использование единиц измерения q в CSS
(The Q Continuum: Using q Measurements In CSS) - Опрос: должен ли CSS стать более похожим на язык программирования?
(Poll: should CSS become more like a programming language?) - Почему HTML думает, что “chucknorris” это цвет? (Why does HTML think “chucknorris” is a color?)
- glamor — внедрённый css в React приложениях (glamor — inline css for react et al)
JavaScript
- JavaScript и SEO в 2016 году
- $mol: reactive micromodular ui-framework
- Детали о версии Node.js v7
(Node.js v7 – URLs, deprecation warnings and a better developer experience) - Совместное планирование с requestIdleCallback
(Cooperative Scheduling with requestIdleCallback) - Теория:
- Паттерн Стратегия на JavaScript
- Ванильный JavaScript vs Фреймворки и Библиотеки — в поисках хорошего баланса (Vanilla JavaScript vs. Frameworks & Libraries — Finding a good balance)
- Учебный план для излечения усталости от JavaScript
(A Study Plan To Cure JavaScript Fatigue) - Является ли JavaScript всегда лучшем решением?
(Editorial: Is JavaScript Always the Best Solution?) - Войны JavaScript. Как мы до этого дошли? (The JavaScript Wars. How did we get here?)
- Замыкания в JavaScript на примерах (Closure in JavaScript through examples)
- Делаем ваш JavaScript более функциональным (Making Your JavaScript More Functional)
- Практика:
- Создание шейдеров с помощью Babylon.js (Building Shaders With Babylon.js)
- Начало работы с MobX: простой пример
(Getting Started With MobX: An Easy Example) - Создание динамических таблиц за секунды из любых JSON данных
(Make Dynamic Tables in Seconds from Any JSON Data) - Программная генерация звуков с Javascript
(Generate Sounds Programmatically With Javascript)
- React:
- 9 полезных советов для тех, кто начинает знакомство с React.js
- Виджет автозаполнения с React (Autocomplete Widget with React)
- Нужна ли вообще библиотека для роутинга? (Do I Even Need A Routing Library?)
- Angular:
- Angular 2 — уходим от распознавания изменений
(Angular 2 — Escape From Change Detection) - Будущее Angular 1.x, что дальше? (The future for Angular 1.x, what next?)
- Простая авторизация с Angular с JSON веб токенами
(Easy Angular Authentication with JSON Web Tokens) - Angular 2 — как использовать преимущества свойства exportAs
(Angular 2 — Take Advantage Of The exportAs Property) - Тестирование Angular 2 в деталях: сервисы (Angular 2 Testing In Depth: Services)
- Angular 2 — уходим от распознавания изменений
- ES6:
- Промисы в Javascript: зачем и как (Javascript Promises; the Why and the How)
- Шесть маленьких, но клевых свойств ES6 (Six Tiny But Awesome ES6 Features)
- Введение в ES6: Переменные, стрелочные функции (Getting to Grips with ES6: )
- Используйте лучшее из ES6 везде (Use the coolest ES6 features everywhere)
- Вычисляемые tag функции для литералов шаблонов ES6
(Computing tag functions for ES6 template literals)
- Vue:
- Замените jQuery на Vue.js в следующем вашем проекте на Bootstrap
(Drop jQuery from your Bootstrap project and replace it with Vue.js) - VueJS: перебор элементов списка (VueJS: Loop List Elements)
- VueJS: условное скрытие/отображение (VueJS: Conditional Show And Hide)
- Замените jQuery на Vue.js в следующем вашем проекте на Bootstrap
- Плагины:
- utransition, микробиблиотека, упрощающая создание анимаций и управление ими в JS
- typeis.js — простой и интеллектуальный детектор типов данных
- Lightflow — библиотека для управления потоком по типу промисов для браузера и Node.js
- SkateJS — библиотека для написания функциональных, лёгких и кросс-фреймворк совместимых веб компонентов по спецификациям W3C
- egjs — библиотека с набором интерактивных UI компонентов
- Recordy — запись с микрофона и добавление эффекта прямо в браузере
Браузеры
- Из Firefox 52 удалят API уровня заряда аккумулятора для сохранения приватности пользовательских данных
- Chrome для Windows стал на 5%-15% быстрее за счет новых оптимизаций
- Microsoft пытается увеличить долю Microsoft Edge c помощью бонусов
- Microsoft Edge обошёл Chrome и Firefox в тесте безопасности
- Internet Explorer и Edge потеряли 40 млн. пользователей
- Новое представление элемента input type=«date» в Firefox
- Firefox Nightly News — поддержка async/await (Firefox Nightly News — async/await support in Firefox)
Новости и занимательное
- Интернет-пользователей, заходящих с настольных компьютеров, стало меньше, чем мобильныхновость
- Pornhub обходит блокировщики рекламы с помощью вебсокетов
- Microsoft запустила сервис для коллективной работы Teams, являющийся частью Office 365
- Викторина: хорошо ли вы знаете Stack Overflow?
- Статистика западных соцсетей: месячная аудитория, доход с пользователя, присутствие брендов
- Влияет ли доменная зона на поисковую выдачу
- Умные лампочки назвали угрозой эпидемии в интернете вещей
- Азбука ИИ: «Рекуррентные нейросети»
- Мобильные гаджеты обогнали ПК по заходам в интернет
- Android стал самой продаваемой мобильной системой в истории
- Duo Security: 65% пользователей до сих пор предпочитают Windows 7
- Почему пионер Linux Линус Торвальдс предпочитает x86, а не ARM
- Как быстро хакеры взломают тостер с выходом в интернет?
- «Dear Microsoft», — письмо от Slack
- Почему Slack может пожалеть из-за своего письма Microsoft
(Why Slack may live to regret its smarmy letter to Microsoft) - Новый MacBook Pro — уже не Laptop для разработчиков часть 1 и 2
(New MacBook Pro is not a Laptop for Developers Anymore)
Просим прощения за возможные опечатки или неработающие/дублирующиеся ссылки. Если вы заметили проблему — напишите пожалуйста в личку, мы стараемся оперативно их исправлять.
Дайджест за прошлую неделю.
Материал подготовили dersmoll и alekskorovin.
Автор: Zfort Group