Дайджест свежих материалов из мира фронтенда за последнюю неделю №337 (29 октября — 4 ноября 2018)

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

Дайджест свежих материалов из мира фронтенда за последнюю неделю №337 (29 октября — 4 ноября 2018) - 1

Libs & Plugins:
• PWA Install Prompt ^[69]
• Введение в plotly.js — опенсорсную графическую библиотеку ^[70]
• simple-keyboard ^[71] — виртуальная клавиатура для Javascript, совместимая с вашим проектами на ES6, React, Vue, Angular или jQuery
• ervy ^[72]: графики в терминалах

Браузеры

• Firefox 63 ^[73], технический обзор от Марата Таналина
• В Firefox 65 появится поддержка формата изображений WebP ^[74]
• Доступен компактный мобильный браузер Firefox Lite 1.0.0 ^[75]
• Новые системы машинного обучения от Fаcebook и Google. Код для раскрашивания чёрно-белых фотографий ^[76]
• WebAssembly Threads готовы к пробе в Chrome 70 ^[77]
• Уроки после поражения: удаление старого отладчика из Firefox ^[78]

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

• Подборка свежих курсов для айтишников от известных университетов ^[79]
• Google запускает reCAPTCHA v3, которая автоматически распознает плохой трафик ^[80]
• Facebook разрабатывает ИИ, который облегчит просмотр видео людям с ограниченными возможностями ^[81]
• Было или не было: обзор расследования Bloomberg о китайских шпионских чипах ^[82]
• Биткоину 10 лет: чего ждать дальше ^[83]
• «Облачные профессии будущего»: чем займутся IoT-архитектор и AI-программист ^[84]
• Основатель ABBYY Давид Ян — о сервисе Yva для анализа поведения сотрудников, опасностях ИИ и ролевых моделях ^[85]
• Хронология развития технологии: человекоподобные роботы ^[86]
• Кому всё это нужно: реакция разработчиков и дизайнеров на новые устройства от Apple ^[87]

Несколько объявлений под конец: следующий выпуск фронтенд-дайджеста будет последним в корпоративном блоге Zfort Group. Через неделю все статьи будут публиковаться с аккаунта alexzfort ^[88], а также в блоге официального сайта компании ^[89]. Кроме всего прочего, там доступна возможность подписки на почтовую рассылку, в планах есть расширенные версии, новые форматы, персонализация и прочие плюшки в контексте улучшения юзабили такого рода контента.

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

Автор: alexzfort

Источник ^[93]

Сайт-источник PVSM.RU: https://www.pvsm.ru

Путь до страницы источника: https://www.pvsm.ru/javascript/298043

Ссылки в тексте:

[1] Медиа: #media

[2] Веб-разработка: #webdev

[3] CSS: #css

[4] Javascript: #js

[5] Браузеры: #browser

[6] Занимательное: #intresting

[7] #77 – Александр Амосов о том, почему стоит начать работать с 3D в браузере: https://soundcloud.com/frontend-weekend/fw-77

[8] Новости 512 — Выпуск №27 (29.10 — 04.11) : https://soundcloud.com/csssr/novosti-512-vypusk-27-2910-0411

[9] №8. Кто такие дивелоперы, ручной SVG и волнительное подчёркивание: https://www.youtube.com/watch?v=Me4j7QeKBCM

[10] PostCSS, мусор в JavaScript, кэширование: https://www.youtube.com/watch?v=ERFV3hsJDNQ

[11] Создание вашего собственного дисфункционального SPA за пять простых шагов: https://tinnedfruit.com/articles/create-your-own-dysfunctional-single-page-app.html

[12] Tags to DOM: https://alistapart.com/article/tags-to-dom

[13] Важность использования стандартов в командах разработчиков: https://blog.logrocket.com/standards-and-why-you-need-them-b48309053e41

[14] Как я занимаюсь полноценной веб-разработкой со своего iPad Pro: https://curtismchale.ca/2018/10/23/how-i-do-web-development-from-my-ipad-pro-full-time/

[15] Как нам удалось ускорить мобильную версию сайта Carousell в 3 раза: https://medium.com/carousell-insider/how-we-made-carousells-mobile-web-experience-3x-faster-bbb3be93e006

[16] Производительность как объект первого класса — Раздел 1: непрерывное измерение и инструментарий: https://engineering.klarna.com/performance-as-first-class-citizen-chapter-1-continuous-measurement-and-tooling-1e6825ef153f

[17] 2019 — год под знаком Page Speed. Вы готовы?: https://unbounce.com/landing-pages/2019-is-the-year-of-page-speed/

[18] Три вида тестирования производительности: https://csswizardry.com/2018/10/three-types-of-performance-testing/

[19] Prettier, ESLint, Husky, Lint-Staged и EditorConfig: инструменты для написания аккуратного кода: https://habr.com/company/ruvds/blog/428173/

[20] 5 способов, которыми DevTools сделал мою жизнь проще: https://medium.com/swlh/5-ways-chrome-devtools-made-my-life-easier-d1b4a49a3826

[21] Введение во FuseBox, альтернативу Webpack: https://auth0.com/blog/introducing-fusebox-an-alternative-to-webpack/

[22] Релиз Storybook 4.0: https://medium.com/storybookjs/storybook-4-0-is-here-10b9857fc7de

[23] Пандус для сайта: https://www.youtube.com/watch?v=vfM0gjLBLUE&feature=youtu.be

[24] Введение в веб-доступность, которую я хотел бы иметь: https://dev.to/maxwell_dev/the-web-accessibility-introduction-i-wish-i-had-4ope

[25] Разрушение пяти мифов цифровой доступности: https://www.deque.com/blog/5-digital-accessibility-myths-busted/

[26] Учим CSS Grid за 5 минут: https://medium.com/webbdev/grid-47c3076539c3

[27] Имплементация вариативного шрифта с веб-шрифтовым фоллбеком : https://www.zeichenschatz.net/typografie/implementing-a-variable-font-with-fallback-web-fonts.html

[28] Рабочая группа CSS в TPAC: что нового в CSS?: https://www.smashingmagazine.com/2018/10/tpac-css-working-group-new/

[29] О переключении с HEX & RGB на HSL: https://www.sarasoueidan.com/blog/hex-rgb-to-hsl/

[30] Как организовать ваш CSS с помощью модульной архитектурой (OOCSS, BEM, SMACSS): https://snipcart.com/blog/organize-css-modular-architecture

[31] Как писать действительно ужасный CSS: https://www.designyourway.net/blog/css-html/how-to-write-truly-terrible-css/

[32] Простое именование в Grid Area: https://css-tricks.com/simple-named-grid-areas/

[33] Анимация превью-изображений в гридах: https://tympanus.net/codrops/2018/10/31/animated-grids-layout/

[34] Кротовые норы в JavaScript: https://habr.com/post/428201/

[35] Рефакторинг в NodeJS с помощью функций высшего порядка: https://medium.com/devschacht/refactoring-node-with-higher-order-functions-8f637c9d82da

[36] Google запретит вход в учетную запись при отключенном в браузере JavaScript: https://xakep.ru/2018/11/01/no-login-without-javascript/

[37] GraphQL — плохое и хорошее: https://scotch.io/tutorials/graphql-the-good-and-the-bad

[38] Ориентирование в жутком мире JavaScript: https://dev.to/aspittel/navigating-the-spooky-world-of-javascript-3h45

[39] Персональный обзор инструментов для автоматического тестирования в мире JavaScript: https://itnext.io/a-personal-review-of-automated-testing-tools-in-the-javascript-world-3c504fe6e05d

[40] Полный современный справочник по JavaScript: https://medium.freecodecamp.org/the-complete-javascript-handbook-f26b2c71719c

[41] Функции высшего порядка в JavaScript: https://habr.com/company/ruvds/blog/428570/

[42] Почему функция map не работает с некоторыми массивами в JavaScript и что с этим делать: https://tproger.ru/translations/why-js-map-doesnt-work/

[43] 4 использования Array.map() в JavaScript, о которых вы должны знать: https://scotch.io/tutorials/4-uses-of-javascripts-arraymap-you-should-know

[44] Эволюция асинхронного JavaScript: от коллбеков к промисам и Async/Await: https://tylermcginnis.com/async-javascript-from-callbacks-to-promises-to-async-await/

[45] Шаблоны проектирования в JavaScript: https://blog.logrocket.com/javascript-design-pattern-214d888096a3

[46] Копирование объектов в Javascript: https://smalldata.tech/blog/2018/11/01/copying-objects-in-javascript

[47] Демистификация Vuex — контейнер состояний для for Vue: https://medium.freecodecamp.org/demystifying-vuex-the-state-container-for-vue-fde82662ca8c

[48] Контролируемые голосом веб-визуализации с помощью Vue.js и Machine Learning: https://css-tricks.com/voice-controlled-web-visualizations-with-vue-js-and-machine-learning/

[49] Создание плагина для WordPress с помощью Vue: https://www.sitepoint.com/building-a-wordpress-plugin-with-vue/

[50] Аргументы для переключения вашей компании на Vue: https://vuejsdevelopers.com/2018/10/29/get-your-company-to-choose-vue/

[51] Создания SPA с помощью Go и Vue: https://www.sitepoint.com/build-a-single-page-app-with-go-and-vue/

[52] Умный способ вызовов Vue API: https://blog.snap.hr/01/11/2018/vue-api-calls-smart-way/

[53] Full Stack Radio 99.5: : http://www.fullstackradio.com/99-5

[54] Что и как тестировать с помощью Jest и Enzyme. Полная инструкция по тестированию React-компонентов: https://medium.com/devschacht/what-and-how-to-test-with-jest-and-enzyme-full-instruction-on-react-components-testing-d3504f3fbc54

[55] Применение принципов SOLID при разработке React-приложений: https://habr.com/company/ruvds/blog/428079/

[56] Разбираемся c React Hooks : https://medium.com/@dan_abramov/making-sense-of-react-hooks-fdbde8803889

[57] React hooks: никакой магии, просто массивы: https://medium.com/@ryardley/react-hooks-not-magic-just-arrays-cd4f1857236e

[58] Все что вам нужно знать о React Hooks: https://medium.com/@vcarl/everything-you-need-to-know-about-react-hooks-8f680dfd4349

[59] Коллекция React Hooks: https://nikgraf.github.io/react-hooks/

[60] Разные способы управления состояниями в React: https://hackernoon.com/a-different-way-to-manage-state-in-react-2d21dfb94482

[61] Отношения любви и ненависти между React Router и React Components: https://blog.bitsrc.io/the-love-hate-relationship-between-react-router-and-react-components-dee4aac5956c

[62] Create React App 2.0: что нового?: https://auth0.com/blog/create-react-app-2.0-whats-new/

[63] Компоненты Lazy-loading в React 16.6: https://blog.logrocket.com/lazy-loading-components-in-react-16-6-6cea535c0b52

[64] Redux в двух словах для React-разработчиков (хинт: это не сложно): https://blog.usejournal.com/redux-in-a-nutshell-for-react-developers-hint-its-not-that-complex-d55041adf99d

[65] Изучение Angular 6 для построения full-stack приложений: https://medium.freecodecamp.org/learn-angular-6-by-building-a-full-stack-application-186659f51a27

[66] Что нового в Angular 7.0 и как вы можете обновиться: https://medium.freecodecamp.org/whats-new-in-angular-7-0-and-how-to-upgrade-f2ed22a79e28

[67] Шаблоны использования GreenSock в Angular: https://medium.com/@philipf5/patterns-for-using-greensock-in-angular-9ec5edf713fb

[68] Урок по созданию простого PWA с помощью Angular и Lighthouse — клона Hacker News: https://medium.com/crowdbotics/learn-to-build-a-simple-progressive-web-app-pwa-with-angular-and-lighthouse-hacker-news-clone-51aca763032f

[69] PWA Install Prompt: https://github.com/JacobDB/pwa-install-prompt

[70] Введение в plotly.js — опенсорсную графическую библиотеку: https://medium.freecodecamp.org/an-introduction-to-plotly-js-an-open-source-graphing-library-c036a1876e2e

[71] simple-keyboard: https://virtual-keyboard.js.org/

[72] ervy: https://www.chunqiuyiyu.com/ervy/

[73] Firefox 63: http://tanalin.com/blog/2018/10/firefox-63/

[74] В Firefox 65 появится поддержка формата изображений WebP : http://www.opennet.ru/opennews/art.shtml?num=49549

[75] Доступен компактный мобильный браузер Firefox Lite 1.0.0: http://www.opennet.ru/opennews/art.shtml?num=49541

[76] Новые системы машинного обучения от Fаcebook и Google. Код для раскрашивания чёрно-белых фотографий: http://www.opennet.ru/opennews/art.shtml?num=49550

[77] WebAssembly Threads готовы к пробе в Chrome 70: https://developers.google.com/web/updates/2018/10/wasm-threads

[78] Уроки после поражения: удаление старого отладчика из Firefox: https://davidwalsh.name/lessons-in-failure

[79] Подборка свежих курсов для айтишников от известных университетов: https://tproger.ru/digest/it-courses-from-top-universities/

[80] Google запускает reCAPTCHA v3, которая автоматически распознает плохой трафик: https://xakep.ru/2018/11/01/recaptcha-v3/

[81] Facebook разрабатывает ИИ, который облегчит просмотр видео людям с ограниченными возможностями: https://itc.ua/blogs/facebook-razrabatyivaet-ii-kotoryiy-oblegchit-prosmotr-video-lyudyam-s-ogranichennyimi-vozmozhnostyami/

[82] Было или не было: обзор расследования Bloomberg о китайских шпионских чипах: https://tproger.ru/cards/bloomberg-supermicro/

[83] Биткоину 10 лет: чего ждать дальше: https://bitcryptonews.ru/analytics/cryptocurrency/bitkoinu-10-let-chego-zhdat-dalshe

[84] «Облачные профессии будущего»: чем займутся IoT-архитектор и AI-программист: https://www.computerra.ru/231619/oblachnye-professii-budushhego-chem-zajmutsya-iot-arhitektor-i-ai-programmist/

[85] Основатель ABBYY Давид Ян — о сервисе Yva для анализа поведения сотрудников, опасностях ИИ и ролевых моделях: https://vc.ru/story/50073-osnovatel-abbyy-david-yan-o-servise-yva-dlya-analiza-povedeniya-sotrudnikov-opasnostyah-ii-i-rolevyh-modelyah

[86] Хронология развития технологии: человекоподобные роботы: https://vc.ru/future/49206-hronologiya-razvitiya-tehnologii-chelovekopodobnye-roboty

[87] Кому всё это нужно: реакция разработчиков и дизайнеров на новые устройства от Apple: https://vc.ru/tech/49614-komu-vse-eto-nuzhno-reakciya-razrabotchikov-i-dizaynerov-na-novye-ustroystva-ot-apple

[88] alexzfort: https://habr.com/users/alexzfort/

[89] официального сайта компании: https://www.zfort.com.ua/

[90] Дайджест за прошлую неделю: https://habr.com/company/zfort/blog/428041/

[91] dersmoll: http://habrahabr.ru/users/dersmoll/

[92] alekskorovin: http://habrahabr.ru/users/alekskorovin/

[93] Источник: https://habr.com/post/428766/?utm_source=habrahabr&utm_medium=rss&utm_campaign=428766

Нажмите здесь для печати.