- PVSM.RU - https://www.pvsm.ru -

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

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

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


    Медиа [1]    |    Веб-разработка [2]    |    CSS [3]    |    Javascript [4]    |    Браузеры [5]    |    Занимательное [6]


Дайджест свежих материалов из мира фронтенда за последнюю неделю №334 (7 — 14 октября 2018) - 2 Медиа

podcast Подкаст «Frontend Weekend» #74 – Михаил Боднарчук о том, как и зачем разработчику тестировать свой код [7]
podcast Подкаст «Девшахта/Ночной фронтенд»: 53: DevOops 2018 [8]
video Видеоблог Вадима Макеева 5. Политех, магический JPEG, ненужная форма и object-fit на SVG [9]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №334 (7 — 14 октября 2018) - 6 Веб-разработка

Почему мы не добавим в HTML элемент <чудесный>? [10]
Как на фронтенд-собеседовании превратить сложный вопрос в лёгкий [11]
en О статических генераторах сайтов [12]
en Развертывание фронтенд приложений — забавный способ [13]
en Использование Web Audio API [14], подробная обновленная информация на MDN
en Продвинутые техники использования Web Audio API: создание звука, последовательность, синхронизация, планирование [15]

  • Инструменты:
    en Что нового в DevTools (Chrome 71) [21]
    en Favicon Checker [22] — онлайн-инструмент для сравнения favicons во всех основных браузерах, включая светлую и темную темы
    en termtosvg [23] — утилита для записи происходящего в терминале в виде SVG
    markdown page [24] — скрипт, который превратит Markdown в HTML одной строкой

Дайджест свежих материалов из мира фронтенда за последнюю неделю №334 (7 — 14 октября 2018) - 22 CSS

en Возможности CSS Content [28]
en CSS Border-Radius может такое? [29]
en Как я запомнил свойства CSS Grid [30]
en Разбирается ли ваш интервьюируемый в CSS лейаутах? [31]
en Предыдущий смежный CSS селектор и как их эмулировать [32]
en 5 вещей, которые вы можете сделать в CSS-in-JS и о которых вы не знали [33]
en video Редактор Shape Path в Firefox [34]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №334 (7 — 14 октября 2018) - 31 JavaScript

Практическое ES6 руководство, о том, как сделать HTTP запрос с помощью Fetch API [35]
Замыкания в JavaScript для начинающих [36]
en JavaScript Visualizer [37] — инструмент для визуализации контекста, всплытия переменных, замыканий, прототипов и других базовых концепций JS для лучшего понимания принципов работы
en Глубокое погружение в this в JavaScript: почему так критично писать хороший код [38]
en 13 игр в ≤ 13kB of JavaScript · js13kGames 2018 [39]
en Давайте разберемся с путаницой вокруг slice( ), splice( ) и split( ) методами в JavaScript [40]
en Новые релизы: Ember 3.4 [41], ESLint v5.7.0 [42], Aurelia-CLI v1.0.0-beta.1, Новый сборщик Aurelia-CLI с авто-трейсом [43]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №334 (7 — 14 октября 2018) - 68 Браузеры

Опубликованы результаты аудита системы обновления Firefox [74]
Разработчики Mozilla отложили прекращение доверия к сертификатам Symantec [75]
В Microsoft Edge найдена брешь, позволяющая запускать любые программы [76]
Google Chrome вскоре перестанет работать на устройствах с ОС Android 4.3 и ниже [77]
en Вызовы между JS и WebAssembly наконец стали быстрыми в Firefox [78]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №334 (7 — 14 октября 2018) - 70 Занимательное

Вышел первый релиз-кандидат Gutenberg 4.0 [79]
Эволюция криптографии: от математики до физики [80]
Регулятор ICANN успешно сменил ключи к доменным именам [81]
Визуальный перевод Google Translate тоже перешел на нейронные технологии и получил поддержку 13 новых языков [82]
Руководство по Windows PowerShell для начинающих [83]
Facebook раскрыла детали последнего взлома: хакеры получили телефоны и адреса электронной почты 30 млн пользователей [84]
Google+ закрывается после утечки данных 500000 аккаунтов [85]
«Яндекс» не смог договориться с правообладателями о новом антипиратском соглашении [86]
Пользователи Alexa признались в любви к голосовому помощнику свыше миллиона раз, но были отвергнуты ею [87]
en Microsoft открыла 60 тысяч патентов, чтобы оградить Linux от исков [88]


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

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

Автор: alexzfort

Источник [92]


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

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

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

[1] Медиа: #media

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

[3] CSS: #css

[4] Javascript: #js

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

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

[7] #74 – Михаил Боднарчук о том, как и зачем разработчику тестировать свой код: https://soundcloud.com/frontend-weekend/fw-74

[8] 53: DevOops 2018: https://soundcloud.com/devschacht/devschacht-53

[9] 5. Политех, магический JPEG, ненужная форма и object-fit на SVG: https://www.youtube.com/watch?v=zjaI-LwqLVU

[10] Почему мы не добавим в HTML элемент <чудесный>?: http://css-live.ru/html5/pochemu-my-ne-dobavim-v-html-element.html

[11] Как на фронтенд-собеседовании превратить сложный вопрос в лёгкий: https://tproger.ru/translations/cracking-frontend-interview/

[12] О статических генераторах сайтов: https://fvsch.com/static-site-generators/

[13] Развертывание фронтенд приложений — забавный способ: https://hackernoon.com/deploying-frontend-applications-the-fun-way-bc3f69e15331

[14] Использование Web Audio API: https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Using_Web_Audio_API

[15] Продвинутые техники использования Web Audio API: создание звука, последовательность, синхронизация, планирование: https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Advanced_techniques

[16] Оптимизируем веб с Виталием Фридманом: скорость загрузки, память, CPU: https://habr.com/company/jugru/blog/426155/

[17] Начало работы с бюджетом производительности: https://medium.com/@addyosmani/start-performance-budgeting-dabde04cf6a3

[18] Адаптивная доставка контента с помощью JavaScript и Network Information API: https://dev.to/addyosmani/adaptive-serving-using-javascript-and-the-network-information-api-331p

[19] Лучшие способы повышения производительности загрузки фронтенда: https://medium.com/@manjunathdavanam/best-ways-to-improve-the-front-end-loading-performance-%EF%B8%8F-3fc3afd41120

[20] Еще одна история успеха PWA + AMP: как Superbalist улучшил скорость загрузки страниц, тем самым повысив конверсии на 26%: https://www.thinkwithgoogle.com/intl/en-145/success-stories/local-case-studies/superbalist-cuts-page-load-time-lift-conversion-rate-26/

[21] Что нового в DevTools (Chrome 71): https://developers.google.com/web/updates/2018/10/devtools

[22] Favicon Checker: http://www.colinkeany.com/favicon-checker/

[23] termtosvg: https://github.com/nbedos/termtosvg

[24] markdown page: https://xakep.ru/2018/10/12/www-md-page/

[25] Шпаргалка по Accessibility: https://moritzgiessmann.de/accessibility-cheatsheet/

[26] WordPress, Accessibility и Gutenberg: https://www.joedolson.com/2018/10/wordpress-accessibility-and-gutenberg/

[27] Я ушел с позиции accessibility team lead в WordPress. И вот почему: https://rianrietveld.com/2018/10/09/i-have-resigned-the-wordpress-accessibility-team/

[28] Возможности CSS Content: https://css-tricks.com/valid-css-content/

[29] CSS Border-Radius может такое?: https://9elements.com/io/css-border-radius/

[30] Как я запомнил свойства CSS Grid: https://zellwk.com/blog/remember-css-grid-properties/

[31] Разбирается ли ваш интервьюируемый в CSS лейаутах?: https://blog.bitsrc.io/how-to-check-the-understanding-of-css-layout-2325621491ad

[32] Предыдущий смежный CSS селектор и как их эмулировать: https://medium.freecodecamp.org/how-to-make-the-impossible-possible-in-css-with-a-little-creativity-bd96bb42b29d

[33] 5 вещей, которые вы можете сделать в CSS-in-JS и о которых вы не знали: https://blog.logrocket.com/5-things-you-can-do-in-css-in-js-that-you-didnt-know-about-c422fb67ceb6

[34] Редактор Shape Path в Firefox : https://www.youtube.com/watch?v=w8pksaGhjfA&feature=youtu.be

[35] Практическое ES6 руководство, о том, как сделать HTTP запрос с помощью Fetch API: http://jem-space.ru/praktichieskoie-es6-rukovodstvo-o-tom-kak-sdielat-http-zapros-s-pomoshchiu-fetch-api/

[36] Замыкания в JavaScript для начинающих: https://medium.com/webbdev/closures-9a20e84b62cd

[37] JavaScript Visualizer: https://tylermcginnis.com/javascript-visualizer/

[38] Глубокое погружение в this в JavaScript: почему так критично писать хороший код: https://medium.freecodecamp.org/a-deep-dive-into-this-in-javascript-why-its-critical-to-writing-good-code-7dca7eb489e7

[39] 13 игр в ≤ 13kB of JavaScript · js13kGames 2018: https://blog.github.com/2018-10-05-js13kgames-highlights-2018/

[40] Давайте разберемся с путаницой вокруг slice( ), splice( ) и split( ) методами в JavaScript: https://medium.freecodecamp.org/lets-clear-up-the-confusion-around-the-slice-splice-split-methods-in-javascript-8ba3266c29ae

[41] Ember 3.4: https://emberjs.com/blog/2018/10/07/ember-3-4-released.html

[42] ESLint v5.7.0: https://eslint.org/blog/2018/10/eslint-v5.7.0-released

[43] Aurelia-CLI v1.0.0-beta.1, Новый сборщик Aurelia-CLI с авто-трейсом: https://aurelia.io/blog/2018/10/08/release-aurelia-cli-with-auto-tracing-bundler/

[44] Использование Event Bus для шаринга props между компонентами Vue: https://css-tricks.com/using-event-bus-to-share-props-between-vue-components/

[45] 12 компаний, которые используют Vue.js в разработке своих приложений: https://naturaily.com/blog/companies-vue-js-applications

[46] Оптимистичне Offline-First приложение с Vuex: https://medium.com/daily-now/optimistic-offline-first-apps-with-vuex-d8a412e105a7

[47] Работа над приложением в Vue.js с TDD — обширное руководство для людей, у которых есть время, часть 1: https://medium.com/magnetis-backstage/working-an-application-in-vue-js-with-tdd-an-extensive-guide-for-people-who-have-time-part-1-3be791dafa2b

[48] Что вам нужно знать о Vue CLI 3: https://www.telerik.com/blogs/what-you-need-to-know-about-vue-cli-3

[49] Незнание основ React, которое, возможно, вас губит: https://habr.com/company/plarium/blog/426197/

[50] Кэширование обработчиков событий и улучшение производительности React-приложений: https://habr.com/company/ruvds/blog/426053/

[51] Как стать React разработчиком в 2018 году: https://habr.com/company/mailru/blog/425821/

[52] React.js: лучшее представление самой мощной UI библиотеки, когда-либо созданной: https://hackernoon.com/react-js-a-better-introduction-to-the-most-powerful-ui-library-ever-created-ecd96e8f4621

[53] OOP и RxJS: управление состояниев в React с помощью Akita: https://engineering.datorama.com/oop-and-rxjs-managing-state-in-react-with-akita-de981e09307

[54] 11 песочниц для работы с UI компонентами React : https://blog.bitsrc.io/11-react-ui-component-playgrounds-for-2018-eef5a87a1bf8

[55] Как объединить Webpack 4 и Babel 7 для создания фантастического приложения на React: https://medium.freecodecamp.org/how-to-combine-webpack-4-and-babel-7-to-create-a-fantastic-react-app-845797e036ff

[56] Что нового в Create React App 2.0, серия видео: https://elijahmanor.com/cra2-playlist/

[57] Нужно ли вам знать React, чтобы быть разработчиком WordPress?: https://www.sitepoint.com/do-you-need-to-know-react-as-a-wordpress-developer/

[58] Тестирование React приложений с помощью react-testing-library: https://blog.bitsrc.io/testing-react-applications-with-react-testing-library-da66aaef740a

[59] Full Stack Radio: 99: Tim Neutkens — Building React Apps with Next.js: http://www.fullstackradio.com/99

[60] Часть 1: https://habr.com/company/ruvds/blog/425661/

[61] Часть 2: https://habr.com/company/ruvds/blog/425663/

[62] Несколько советов по Angular: https://habr.com/post/425959/

[63] Анонс первого стабильного релиза Angular Console — UI для Angular CLI: https://blog.nrwl.io/announcing-the-first-stable-release-of-angular-console-the-ui-for-the-angular-cli-bb19093a92d4

[64] Вложенные формы в Angular 6: https://www.telerik.com/blogs/nested-forms-in-angular-6

[65] Стайлинг: https://ngrefs.com/en/v6/styling/intro

[66] Роутер: https://ngrefs.com/en/v6/router/intro

[67] Angular & Chart.js (с ng2-charts): https://codingthesmartway.com/angular-chart-js-with-ng2-charts/

[68] Создание фул-стэк приложений с помощью Angular CLI и Nx: https://blog.nrwl.io/building-full-stack-applications-using-angular-cli-and-nx-5eff205248f1

[69] TensorFlow.js и clmtrackr.js: отслеживание направления взгляда пользователя в браузере: https://habr.com/company/ruvds/blog/426055/

[70] Deity Falcon: https://github.com/deity-io/falcon

[71] perfume.js: https://github.com/Zizzamia/perfume.js

[72] mb: https://github.com/burakcan/mb

[73] Muze: https://www.charts.com/muze

[74] Опубликованы результаты аудита системы обновления Firefox: https://www.opennet.ru/opennews/art.shtml?num=49422

[75] Разработчики Mozilla отложили прекращение доверия к сертификатам Symantec: http://www.opennet.ru/opennews/art.shtml?num=49431

[76] В Microsoft Edge найдена брешь, позволяющая запускать любые программы: https://tproger.ru/news/poc-code-edge/

[77] Google Chrome вскоре перестанет работать на устройствах с ОС Android 4.3 и ниже: https://keddr.com/2018/10/google-chrome-vskore-perestanet-rabotat-na-ustroystvah-s-os-android-4-3-i-nizhe/

[78] Вызовы между JS и WebAssembly наконец стали быстрыми в Firefox: https://hacks.mozilla.org/2018/10/calls-between-javascript-and-webassembly-are-finally-fast-%F0%9F%8E%89/

[79] Вышел первый релиз-кандидат Gutenberg 4.0: http://oddstyle.ru/wordpress-2/novosti-wordpress/vyshel-pervyj-reliz-kandidat-gutenberg-4-0.html

[80] Эволюция криптографии: от математики до физики: https://tproger.ru/translations/understanding-cryptography/

[81] Регулятор ICANN успешно сменил ключи к доменным именам: https://itc.ua/blogs/regulyator-icann-uspeshno-smenil-klyuchi-k-domennyim-imenam/

[82] Визуальный перевод Google Translate тоже перешел на нейронные технологии и получил поддержку 13 новых языков: https://itc.ua/news/vizualnyiy-perevod-google-translate-tozhe-pereshel-na-neyronnyie-tehnologii-i-poluchil-podderzhku-13-novyih-yazyikov/

[83] Руководство по Windows PowerShell для начинающих: https://tproger.ru/translations/powershell-tutorial/

[84] Facebook раскрыла детали последнего взлома: хакеры получили телефоны и адреса электронной почты 30 млн пользователей: https://vc.ru/social/47972-facebook-raskryla-detali-poslednego-vzloma-hakery-poluchili-telefony-i-adresa-elektronnoy-pochty-30-mln-polzovateley

[85] Google+ закрывается после утечки данных 500000 аккаунтов: https://xakep.ru/2018/10/09/google-plus-rip/

[86] «Яндекс» не смог договориться с правообладателями о новом антипиратском соглашении: https://www.computerworld.ru/news/Yandex-ne-smog-dogovoritsya-s-pravoobladatelyami-o-novom-antipiratskom-soglashenii

[87] Пользователи Alexa признались в любви к голосовому помощнику свыше миллиона раз, но были отвергнуты ею: https://itc.ua/blogs/polzovateli-alexa-priznalis-v-lyubvi-k-golosovomu-pomoshhniku-svyishe-milliona-raz-no-byili-otvergnutyi-eyu/

[88] Microsoft открыла 60 тысяч патентов, чтобы оградить Linux от исков: https://thenextweb.com/microsoft/2018/10/11/microsoft-made-60000-patent-open-source/

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

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

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

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