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

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

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

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

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


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

podcast Подкаст «Фронтенд Юность (18+)» #90 Гуй эксперту не помеха [7]
video proConf #9 VUEJS AMSTERDAM 2019 [8]
video «ALL YOUR HTML» #s2e10: «Phenomenon с Parcel» [9]
video WSD в Москве, 2019 [10], запись трансляции
video MinskCSS Meetup #6 — 11 апреля 2019 [11]

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

habr Как создать тёмную тему и не навредить. Опыт команды Яндекс.Почты [12]
habr Перенос сайта на статику: мотивация, стоимость, работа [13]
habr Почему не нужно тратить свое время на создание нишевых тематических сайтов [14]
Результат опроса предпочтений разработчиков от Stack Overflow [15]
en Front-end Developer Handbook 2019 [16]
en Inline SVG… Кешируется [17]
en Веб-разработка в иллюстрациях [18]
en Типы мобильных инпутов [19]
en video Javascript vs. CSS — больше контроля означает больше ответственности [20]
en Не доверяйте локальным хранилищам: исследование распространенности постоянных межсайтовых клиентских скриптов [21]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №360 (7 — 14 апреля 2019) - 27 CSS

Чего мне никогда не говорили о CSS [30]
Разница между width и flex-basis [31]
Как работает @supports [32]
en Уже 2019 год. Давайте закончим дискуссию об иконочных шрифтах и SVG иконках [33]
en Руководство по пониманию CSS Houdini с помощью комиксов [34]
en Трюки и советы для CSSBattle [35]
en Анимация SVG с помощью CSS [36]
en Выполните следующие шаги, чтобы стать суперзвездой CSS [37]
en Получаем значение кастомного свойства CSS с помощью JavaScript [38]
en Художественное руководство для веба с использованием CSS Shapes [39]
en Использование миксина для вывода математики из адаптивных размеров шрифта [40]
en Почему вы должны использовать CSS env() [41]
en QUIZ: Well aimed? Насколько хорошо вы знаете CSS селекторы? [42]
en sassyfication: библиотека с Sass примесями для ускорения разработки CSS [43]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №360 (7 — 14 апреля 2019) - 39 JavaScript

В AMP добавят поддержку JavaScript [44]
Три Больших Лжи о JavaScript [45]
en Релиз jQuery 3.4.0 [46]
en Использование Web Speech API для мультиязычных переводов [47]
en Пять причин, почему веб-компоненты могут дополнить фреймворки JavaScript [48]
en Кайл Симпсон: я забыл больше JavaScript, чем было выучено большинством людей [49]
en Список из 31 самых популярных JS репозиториев на GitHub в апреле 2019 [50]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №360 (7 — 14 апреля 2019) - 73 Браузеры

habr Microsoft Edge на Chromium официально доступен для открытого тестирования [76]
В Firefox Beta добавлен блокировщик скриптов майнинга и скрытой идентификации [77]
В Chromium доступна отложенная загрузка iframe и изображений. Тестовый выпуск Microsoft Edge [78]
Chrome и Safari убрали возможность отключения атрибута отслеживания кликов [79]
Вышла Opera 60 (Reborn 3) — первый десктопный браузер c поддержкой «интернета будущего» Web 3, криптокошельком и бесплатным VPN [80]
en Edge идет к Chromium: что это значит для разработчиков фронтенда? [81]

Дайджест свежих материалов из мира фронтенда за последнюю неделю №360 (7 — 14 апреля 2019) - 76 Занимательное

GitHub полностью «удалил» репозиторий утилиты для обхода блокировок и весь аккаунт создателя [82]
Google: Частое сканирование не способствует улучшению позиций сайта [83]
Вскоре Google Docs начнет поддерживать родные форматы Microsoft Word, Excel и PowerPoint [84]
От раннего Интернета осталось очень мало свидетельств [85]
Владелец прав на Helvetica выпустил первый за 35 лет редизайн шрифта [86]
ЕС выработал свод этических принципов для искусственного интеллекта [87]
Основатель Alibaba Джек Ма заступился за культуру работы по 12 часов в сутки шесть дней в неделю [88]


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

Дайджест за прошлую неделю [89]

Материал подготовили dersmoll [90] и alekskorovin [91]

Автор: alexzfort

Источник [92]


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

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

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

[1] Медиа: #media

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

[3] CSS: #css

[4] Javascript: #js

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

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

[7] #90 Гуй эксперту не помеха : https://soundcloud.com/frontend_u/e90

[8] proConf #9 VUEJS AMSTERDAM 2019: https://www.youtube.com/watch?v=Ne9chW6nFNQ

[9] «Phenomenon с Parcel»: https://www.youtube.com/watch?v=QM2d1s8ZK2A

[10] WSD в Москве, 2019: https://www.youtube.com/watch?v=r4txCvuHFPc

[11] MinskCSS Meetup #6 — 11 апреля 2019: https://www.youtube.com/playlist?list=PL3uk4LxG9Zzl9LTp0yLfaXhIu7-xoUHQN

[12] Как создать тёмную тему и не навредить. Опыт команды Яндекс.Почты: https://habr.com/ru/company/yandex/blog/446780/

[13] Перенос сайта на статику: мотивация, стоимость, работа: https://habr.com/ru/company/e-Legion/blog/440134/

[14] Почему не нужно тратить свое время на создание нишевых тематических сайтов: https://habr.com/ru/post/447952/

[15] Результат опроса предпочтений разработчиков от Stack Overflow: http://www.opennet.ru/opennews/art.shtml?num=50492

[16] Front-end Developer Handbook 2019: https://frontendmasters.com/books/front-end-handbook/2019/

[17] Inline SVG… Кешируется: https://css-tricks.com/inline-svg-cached/

[18] Веб-разработка в иллюстрациях: https://illustrated.dev/

[19] Типы мобильных инпутов: http://mobileinputtypes.com/

[20] Javascript vs. CSS — больше контроля означает больше ответственности: https://www.youtube.com/watch?v=4HuJoPIeyQo

[21] Не доверяйте локальным хранилищам: исследование распространенности постоянных межсайтовых клиентских скриптов: https://blog.acolyer.org/2019/04/10/dont-trust-the-locals-investigating-the-prevalence-of-persistent-client-side-cross-site-scripting-in-the-wild/

[22] Нативная ленивая загрузка и fallback на основе js с vanilla-lazyload 12: https://www.andreaverlicchi.eu/native-lazy-loading-with-vanilla-lazyload/

[23] Google AMP снизил скорость нашей страницы, и нет другого выбора, кроме его использования: https://unlikekinds.com/article/google-amp-page-speed

[24] Как получить оценку 100% производительности в Lighthouse: https://www.deleteagency.com/blog/how-to-get-a-100-percents-lighthouse-performance-score

[25] Распространенная проблема доступности: переход к разделу страницы без смещения фокуса клавиатуры: https://christianheilmann.com/2019/04/09/common-accessibility-issue-moving-to-a-page-section-without-shifting-keyboard-focus/

[26] Доступность цветов: инструменты и ресурсы, которые помогут вам создавать инклюзивные продукты: https://stephaniewalter.design/blog/color-accessibility-tools-resources-to-design-inclusive-products/

[27] Топ 5 вопросов, задаваемых при изучении Accessibility : https://www.deque.com/blog/top-5-questions-asked-in-accessibility-trainings/

[28] Как создать эффект прилипающего изображения с Three.js: https://tympanus.net/codrops/2019/04/10/how-to-create-a-sticky-image-effect-with-three-js/

[29] Разъединение SVG с помощью переиспользуемых компонентов WebGL с использованием React-Three-Fibre: https://tympanus.net/codrops/2019/04/12/pulling-apart-svgs-with-reusable-webgl-components-using-react-three-fiber/

[30] Чего мне никогда не говорили о CSS: https://medium.com/webbdev/css-48a2eded605b

[31] Разница между width и flex-basis: https://medium.com/@stasonmars/%D1%80%D0%B0%D0%B7%D0%BD%D0%B8%D1%86%D0%B0-%D0%BC%D0%B5%D0%B6%D0%B4%D1%83-width-%D0%B8-flex-basis-f34e658ce6a2

[32] Как работает @supports: https://medium.com/webbdev/css-264fc77cc04

[33] Уже 2019 год. Давайте закончим дискуссию об иконочных шрифтах и SVG иконках: https://www.lambdatest.com/blog/its-2019-lets-end-the-debate-on-icon-fonts-vs-svg-icons/

[34] Руководство по пониманию CSS Houdini с помощью комиксов: https://medium.freecodecamp.org/a-guide-to-understanding-css-houdini-with-the-help-of-cartoons-f40af2540093

[35] Трюки и советы для CSSBattle: https://spectrum.chat/css-battle/general/tips-n-tricks~6034b7fa-d08b-463a-9720-decb5e2c0f5b

[36] Анимация SVG с помощью CSS: https://blog.logrocket.com/animating-svg-with-css-83e8e27d739c

[37] Выполните следующие шаги, чтобы стать суперзвездой CSS: https://medium.freecodecamp.org/follow-these-steps-to-become-a-css-superstar-837cd6cb9b1a

[38] Получаем значение кастомного свойства CSS с помощью JavaScript: https://andy-bell.design/wrote/get-css-custom-property-value-with-javascript/

[39] Художественное руководство для веба с использованием CSS Shapes: https://www.smashingmagazine.com/2019/04/art-direction-for-the-web-using-css-shapes/

[40] Использование миксина для вывода математики из адаптивных размеров шрифта: https://css-tricks.com/using-a-mixin-to-take-the-math-out-of-responsive-font-sizes/

[41] Почему вы должны использовать CSS env(): https://blog.logrocket.com/why-you-should-use-css-env-9ee719ce0f24

[42] QUIZ: Well aimed? Насколько хорошо вы знаете CSS селекторы?: https://codepen.io/pehaa/full/ROapJZ

[43] sassyfication: библиотека с Sass примесями для ускорения разработки CSS: https://github.com/Simonwep/sassyfication#positiontop-right-bottom-left

[44] В AMP добавят поддержку JavaScript: https://www.searchengines.ru/amp-js.html

[45] Три Больших Лжи о JavaScript: https://medium.com/webbdev/js-8de483e30c44

[46] Релиз jQuery 3.4.0: https://blog.jquery.com/2019/04/10/jquery-3-4-0-released/

[47] Использование Web Speech API для мультиязычных переводов: https://css-tricks.com/using-the-web-speech-api-for-multilingual-translations/

[48] Пять причин, почему веб-компоненты могут дополнить фреймворки JavaScript: https://medium.com/javascript-in-plain-english/could-web-components-actually-compliment-javascript-frameworks-5-reasons-why-i-think-so-971eee82ee85

[49] Кайл Симпсон: я забыл больше JavaScript, чем было выучено большинством людей: https://medium.com/@amsterdamjs/kyle-simpson-ive-forgotten-more-javascript-than-most-people-ever-learn-3bddc6c13e93

[50] Список из 31 самых популярных JS репозиториев на GitHub в апреле 2019: https://itnext.io/31-most-popular-github-js-repositories-in-april19-b18ea6fec58b

[51] Основы движков JavaScript: оптимизация прототипов. Часть 1: https://habr.com/ru/company/otus/blog/447870/

[52] Что нужно знать про массивы в JavaScript: https://tproger.ru/translations/javascript-arrays-best-practices/

[53] Подводные камни Async / Await в циклах массивов: https://medium.com/dailyjs/the-pitfalls-of-async-await-in-array-loops-cf9cf713bfeb

[54] В защиту тернарных операторов: https://css-tricks.com/in-defense-of-the-ternary-statement/

[55] Улучшение асинхронного программирования с JavaScript promises: https://blog.logrocket.com/improve-async-programming-with-javascript-promises-1652ac8d036d

[56] Шаблоны проектирования в современной JavaScript разработке: https://levelup.gitconnected.com/design-patterns-in-modern-javascript-development-ec84d8be06ca

[57] Что бы я хотел знать, когда начинал работать с React.js: https://medium.freecodecamp.org/what-i-wish-i-knew-when-i-started-to-work-with-react-js-3ba36107fd13

[58] Рекомендации по стилизации в React: https://medium.com/the-non-traditional-developer/styling-best-practices-using-react-c37b96b8be9c

[59] Лучшие React расширения для VS Code: https://scotch.io/tutorials/the-best-react-extension-for-vs-code

[60] Обзор популярных CSS-in-JS библиотек для React: https://www.telerik.com/blogs/overview-of-popular-css-in-js-libraries-for-react

[61] Управление состоянием с помощью React Hooks — без Redux или Context API: https://medium.com/javascript-in-plain-english/state-management-with-react-hooks-no-redux-or-context-api-8b3035ceecf8

[62] React95: https://github.com/React95/React95

[63] Почему ваша компания должна начать использовать Vue.js: https://medium.com/@robewawebdesign/why-your-company-should-start-using-vue-js-6ac01969573

[64] Представление нового State-Management для Vue.js: https://medium.com/js-dojo/introducing-a-new-state-management-for-vue-js-b85be00b3299

[65] Краткий отчет о конференции VueJs Amsterdam 2019 (часть 2): https://www.telerik.com/blogs/vuejs-amsterdam-2019-experience-and-talks-summary-part-2

[66] Почему я предпочёл Vue, а не React: https://blog.bitsrc.io/why-i-chose-vue-over-react-f1507fa8e382

[67] Получение данных со сторонних API с помощью Vue.js и Axios: https://www.sitepoint.com/fetching-data-third-party-api-vue-axios/

[68] Сделайте свои веб-приложения Vue.js доступными для просмотра — JavaScript SEO: https://www.youtube.com/watch?v=Op8Q8bUAKNc&list=PLKoqnv2vTMUPOalM1zuWDP9OQl851WMM9&index=8

[69] Лучшее из опыта создания чистых и быстрых Angular приложений: https://habr.com/ru/post/447042/

[70] Angular Context: простое связывание данных для вложенных деревьев компонентов и Router Outlet: https://medium.com/@ozak/angular-context-easy-data-binding-for-nested-component-trees-and-the-router-outlet-a977efacd48

[71] Angular CLI — Demystifying the workspace: https://blog.nrwl.io/angular-cli-demystifying-the-workspace-7f59ffaab4cb

[72] Advanced Angular: реализация переиспользуемого компонента автозаполнения: https://netbasal.com/advanced-angular-implementing-a-reusable-autocomplete-component-9908c2f04f5

[73] fkit: набор функциональных утилит для JavaScript: https://github.com/nullobject/fkit

[74] jQuery Terminal Emulator — терминал для веба: https://github.com/jcubic/jquery.terminal

[75] Choices.js: https://github.com/jshjohnson/Choices

[76] Microsoft Edge на Chromium официально доступен для открытого тестирования: https://habr.com/en/company/microsoft/blog/447364/

[77] В Firefox Beta добавлен блокировщик скриптов майнинга и скрытой идентификации: http://www.opennet.ru/opennews/art.shtml?num=50490

[78] В Chromium доступна отложенная загрузка iframe и изображений. Тестовый выпуск Microsoft Edge: http://www.opennet.ru/opennews/art.shtml?num=50482

[79] Chrome и Safari убрали возможность отключения атрибута отслеживания кликов: http://www.opennet.ru/opennews/art.shtml?num=50483

[80] Вышла Opera 60 (Reborn 3) — первый десктопный браузер c поддержкой «интернета будущего» Web 3, криптокошельком и бесплатным VPN : https://itc.ua/news/vyishla-opera-60-reborn-3-pervyiy-desktopnyiy-brauzer-c-podderzhkoy-interneta-budushhego-web-3-kriptokoshelkom-i-besplatnyim-vpn/

[81] Edge идет к Chromium: что это значит для разработчиков фронтенда?: https://css-tricks.com/edge-goes-chromium-what-does-it-mean-for-front-end-developers/

[82] GitHub полностью «удалил» репозиторий утилиты для обхода блокировок и весь аккаунт создателя: https://habr.com/ru/post/447902/

[83] Google: Частое сканирование не способствует улучшению позиций сайта: https://www.searchengines.ru/google-more-crawling.html

[84] Вскоре Google Docs начнет поддерживать родные форматы Microsoft Word, Excel и PowerPoint: https://itc.ua/news/vskore-google-docs-nachnet-podderzhivat-rodnyie-formatyi-microsoft-word-excel-i-powerpoint/

[85] От раннего Интернета осталось очень мало свидетельств: https://www.computerra.ru/236566/ot-rannego-interneta-ostalos-ochen-malo-svidetelstv/

[86] Владелец прав на Helvetica выпустил первый за 35 лет редизайн шрифта: https://vc.ru/design/64016-vladelec-prav-na-helvetica-vypustil-pervyy-za-35-let-redizayn-shrifta

[87] ЕС выработал свод этических принципов для искусственного интеллекта: https://itc.ua/news/es-vyirabotal-svod-eticheskih-printsipov-dlya-iskusstvennogo-intellekta/

[88] Основатель Alibaba Джек Ма заступился за культуру работы по 12 часов в сутки шесть дней в неделю: https://vc.ru/hr/64360-osnovatel-alibaba-dzhek-ma-zastupilsya-za-kulturu-raboty-po-12-chasov-v-sutki-shest-dney-v-nedelyu

[89] Дайджест за прошлую неделю: https://habr.com/ru/post/447128/

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

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

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