С прошлого дайджеста прошло два с половиной месяца. За это время самым ярким событием стала React-конференция, где показали удивительные штуки — например, React Native. Эта простая библиотека на наших глазах стала промышленным стандартом. React используют Facebook, Yahoo, Netflix, Airbnb, и мы в Grammarly тоже делаем ставку на нее.
Библиотека React
Обзор конференции по Реактусо списком всех видео (посмотрите обязательно про react native и immutable)
Описание Relay и GraphQLот Facebook
На этом сайте собирают крутые ссылки по темам, в том числе по Реакту: getawesomeness.com
Обзорплохого подхода использования MVC вместе с Реактом
Новая статьяв документации Реакта о производительности.
Cтатьяо будущих изменениях в Реакте.
Отличное описание и примеры использование Flux от Dan Abramov.
Hip-chat переписали на React.
Флипбоард рендерит реактом на канвас (монстрячество).
Polarrпоказали альфу новой версии фото-редактора на реакте.
Реакт-компонент таблицыдля больших обьемов данных.
Reapp.io — фреймворк для построения мобильных интерфейсов на Реакте (не Native).
Почитать
Причиныне использовать AngularJS в ваших проектах. Холивар в коментариях.
Нетрадиционное ревьюАнгуляра.
Развернутое сравнение Browserfy и Webpack.
«Destructuring and Recursion in ES-6» — статья для углубления знаний ES6.
Статьяо функциональном программировании на JavaScript.
Серфинг из комментариев по этой же теме: essence of functional programming.
Journey from procedural to reactive JavaScript with stops
Детальная статья о промисах
Большая статья declarative touch interactionsс корнями из статьи об анимацияхтого же автора.
Производительность веб-анимаций на мобильных устройствах
Качественный справочник по CSSс примерами.
Хорошее руководствопо флекс-боксу.
Мысли о том, как сделать CSS расширяемым.
Статьяразбирает, как вставлять адаптируемые под разные медиа-условия картинки.
Верстка авто-исчезающего хедера
Паттерны js-ошибок, полезно для начинающих.
Коммуникациямежду табами в браузере.
Посмотреть
Любопытный доклад «Server-less applications powered by Web Components».
Докладо Immutable-структурах данных.
Новое крутое видеоот Netflix о ES6/7.
Новичкам фронтенда пригодится сайт с короткими обучающими видео.
Библиотеки
Pouchdb.com — база данных на JavaScript для оффлайн-синхронизации приложений.
Formatjs.io — мощная библиотека от Yahoo для локализации.
Виджетдля наблюдения за расходом памяти.
Awesomplete — легковесный автокомплит.
Lz-string — поможет сохранить в localStorage больше данных, чем позволяет обычная строка. Актуально для мобильных устройств.
Pluminjs — JavaScript библиотека для редактирования шрифтов!
Defiantjs — мощный библиотека, реализует XPath для JSON. Умеет применять JSON на XSLT.
Инструменты
Обзориспользования ESLint для контроля качества кода от PayPal
Pixact.ly — тестируем пиксельмер
Navigator.sendBeacon — метод, позволяющий отсылать данные на сервер без ожидания ответа. Запросы собираются в очередь и обрабатываются при первой же возможности.
У Хрома есть апи, которое можно использовать для профилирования
SVGomg — онлайн SVG-редактор
Webfontload.com — удобный способ поставить Google Web Fonts на OS X
Демки
Примеры использования Elastic SVG анимации
Создание вечной анимации на CSS
Примерыанимированой заливки текста
Анимация перемещения элементов списка
Крутой пример использования SVG фильтров (слипающиеся фигуры)
Кроссбраузерный CSS-слайдери еще коллекция слайдеров.
Хорошо проработанный стилизованный переключатель.
Сумасшедший CSS-рендер.
Огоньна CSS.
Остальное
Сравнение конструкцийв разных версиях JavaScript
Not-born-to-die: 6to5 переименовали в babel.
У BrowserSyncпоявился интерфейс.
Фронтенд-гайдлайныи стандарты от TMWUnlimited.
Субьективные гайдлайныдизайнера-разработчика из Страйпа.
Devdocs.io — тех. документация в одном месте, работает в офлайне.
Libscore.com — статистика использования фронтенд-библиотек.
Таблицасравнения функций популярных CSS фреймворков.
JavaScript Has Won: Run Flash with Mozilla Shumway and Develop Silverlight in JS with Fayde — вовсю компилят Флеш и Сильверлайт на JS
Chrome Dev Tools наращивает мощности — сделали редактор кривых для аннимаций.
В феврале прошла Фронтенд-встреча — судя по отзывам, людям понравилось. С прицелом на следующую встречу (пока не знаю дату) хотелось бы узнать, чем сейчас интересуетесь, какие технологии используете в проектах, что собираетесь внедрять.
Отдельно напомню, что у нас есть места во фронтенд команде. Задачи — веб-редактор, браузерное расширение, движок редактирования (что-то вроде Гугл-докса). Продуктами пользуются миллионы пользователей. Кому интересно, напишите на kigorw@grammarly.comрассказ (рассказ) о себе, и я вам дам тестовое задание.
С вами был Игорь Кононученко @kigorw. Оформить дайджест помогал мой коллега Сергей Руденко.
← Предыдущий выпуск: Frontend дайджест #5.