Stop talking about WebAssembly specification, let's solve a problems using it! How to WebAssembly work and how we can use it to enhance Machine Learning in browser experience.
JavaScript и инновации by Max Klymyshyn
Published July 5, 2014 in Technology
Как возникло то, что мы имеем в JavaScript, что уже существует и какие инновации нас ждут в ближайшем будущем
Microsoft Edge и платформа веб-приложений в Windows 10 / Константин Кичинский...Ontico
Microsoft Edge -- новый браузер от Microsoft с новым движком и новым интерфейсом.
Какие цели преследует Microsoft, и что это нововведение означает для веб-разработчиков?
Что нового в движке браузера по сравнению с IE, и как он будет развиваться дальше?
Движок Edge внутри Windows 10: хостинг сайтов внутри приложений и доступ к нативной функциональности.
Дорожная карта: к чему и когда готовиться?
"Как остаться в светлой памяти: доклад о том, почему наши приложения вылетают...Egor Petrov
В своих проектах мы часто забываем об out of memory error. Доклад посвящен причинам появления таких ошибок, механизмам контроля со стороны iOS, а также инструментам их отслеживания. Отдельно разберем, как бороться с потерей памяти превентивными мерами: работой с изображениями, контролем кэша, выгрузкой неиспользуемых экранов и другими. Такой доклад забыть не получится.
JavaScript и инновации by Max Klymyshyn
Published July 5, 2014 in Technology
Как возникло то, что мы имеем в JavaScript, что уже существует и какие инновации нас ждут в ближайшем будущем
Microsoft Edge и платформа веб-приложений в Windows 10 / Константин Кичинский...Ontico
Microsoft Edge -- новый браузер от Microsoft с новым движком и новым интерфейсом.
Какие цели преследует Microsoft, и что это нововведение означает для веб-разработчиков?
Что нового в движке браузера по сравнению с IE, и как он будет развиваться дальше?
Движок Edge внутри Windows 10: хостинг сайтов внутри приложений и доступ к нативной функциональности.
Дорожная карта: к чему и когда готовиться?
"Как остаться в светлой памяти: доклад о том, почему наши приложения вылетают...Egor Petrov
В своих проектах мы часто забываем об out of memory error. Доклад посвящен причинам появления таких ошибок, механизмам контроля со стороны iOS, а также инструментам их отслеживания. Отдельно разберем, как бороться с потерей памяти превентивными мерами: работой с изображениями, контролем кэша, выгрузкой неиспользуемых экранов и другими. Такой доклад забыть не получится.
Лицо разработчика — это качество его кода. А что может быть лучше, чем плавный интерфейс без глитчей. Разберемся, как рендерится UI, где возникают проблемы и как их лечить.
Эволюция клиентской разработки: от веба ко "всеобщей мобилизации” или mobile-...Pavel Dovbush
История развития проекта с точки зрения клиентских технологий - от веб-сайта к появлению мобильных клиентов и смещению фокуса к mobile-first разработке. Общие черты нашей архитектуры и их отличия от стандартных решений.
Единый протокол общения с приложениями iOS/Android/WindowsMobile/MobileWeb/Web и особенности реализации для JavaScript платформ (десктопные и мобильные браузеры).
Изменение процесса разработки и подходов к реализации нового функционала для переключения на mobile-first стратегию.
Лицо разработчика — это качество его кода. А что может быть лучше, чем плавный интерфейс без глитчей. Разберемся, как рендерится UI, где возникают проблемы и как их лечить.
Как мы адаптировали более 150 сайтов по технологии Dynamically-served JavaScr...Ontico
° С чего мы начинали;
° Все способы адаптации;
° JavaScript-adaptive;
° Опыт создания собственной библиотеки;
° История панели управления;
° Сервис оптимизации изображений;
° Чему мы научились.
Интерактивные карты планировок на сайтах торговых центровАгентство AlterEGO
Как сделать навигацию по торговому центру удобной? Какие инструменты доступны разработчику, обзор сильных и слабых сторон основных технологий.
– map vs SVG vs Яндекс.Карты/Google.Maps
– SVG и IE
– Что же выбрать в итоге?
SECON'2016. Аверин Сергей, Javascript-фреймворки: должен остаться только одинSECON
Рассказ от tech-менеджера о том, как мы в Acronis выбирали фреймворк в условиях, когда любое более-менее важное технологическое решение сразу затрагивает с десяток команд, несколько сотен человек и права «случайно все сломать» нет.
"Mobile Velocity Index: Data-driven оптимизация времени старта" / Павел Воро...Egor Petrov
Зачем оптимизировать время старта и какие метрики выбрать как целевые? Можно ли свести все к одному интегральному показателю? Мы в Супераппе Яндекса используем для контроля скорости старта Mobile Velocity Index. Расскажем про методику расчета Mobile Velocity Index и практику его применения.
Что такое принцип future-friendly web. В чем разница между Progressive Enhancement и Graceful Degradation. Использование современных возможностей аналитики в процессе разработки сайтов. Решения, дружественные к будущему. Создание проектов, ориентированных на пользователя.
Баба-Яга против! — Роман Дворнов, Ostrovok.ruYandex
В последнее время во фронтенде появляется столько нового и внедряется настолько быстро, что не все успевают осознать последствия. Хорошо это или плохо? Рассмотрим некоторые новинки с точки зрения «за», а главное – «против».
Лицо разработчика — это качество его кода. А что может быть лучше, чем плавный интерфейс без глитчей. Разберемся, как рендерится UI, где возникают проблемы и как их лечить.
Эволюция клиентской разработки: от веба ко "всеобщей мобилизации” или mobile-...Pavel Dovbush
История развития проекта с точки зрения клиентских технологий - от веб-сайта к появлению мобильных клиентов и смещению фокуса к mobile-first разработке. Общие черты нашей архитектуры и их отличия от стандартных решений.
Единый протокол общения с приложениями iOS/Android/WindowsMobile/MobileWeb/Web и особенности реализации для JavaScript платформ (десктопные и мобильные браузеры).
Изменение процесса разработки и подходов к реализации нового функционала для переключения на mobile-first стратегию.
Лицо разработчика — это качество его кода. А что может быть лучше, чем плавный интерфейс без глитчей. Разберемся, как рендерится UI, где возникают проблемы и как их лечить.
Как мы адаптировали более 150 сайтов по технологии Dynamically-served JavaScr...Ontico
° С чего мы начинали;
° Все способы адаптации;
° JavaScript-adaptive;
° Опыт создания собственной библиотеки;
° История панели управления;
° Сервис оптимизации изображений;
° Чему мы научились.
Интерактивные карты планировок на сайтах торговых центровАгентство AlterEGO
Как сделать навигацию по торговому центру удобной? Какие инструменты доступны разработчику, обзор сильных и слабых сторон основных технологий.
– map vs SVG vs Яндекс.Карты/Google.Maps
– SVG и IE
– Что же выбрать в итоге?
SECON'2016. Аверин Сергей, Javascript-фреймворки: должен остаться только одинSECON
Рассказ от tech-менеджера о том, как мы в Acronis выбирали фреймворк в условиях, когда любое более-менее важное технологическое решение сразу затрагивает с десяток команд, несколько сотен человек и права «случайно все сломать» нет.
"Mobile Velocity Index: Data-driven оптимизация времени старта" / Павел Воро...Egor Petrov
Зачем оптимизировать время старта и какие метрики выбрать как целевые? Можно ли свести все к одному интегральному показателю? Мы в Супераппе Яндекса используем для контроля скорости старта Mobile Velocity Index. Расскажем про методику расчета Mobile Velocity Index и практику его применения.
Что такое принцип future-friendly web. В чем разница между Progressive Enhancement и Graceful Degradation. Использование современных возможностей аналитики в процессе разработки сайтов. Решения, дружественные к будущему. Создание проектов, ориентированных на пользователя.
Баба-Яга против! — Роман Дворнов, Ostrovok.ruYandex
В последнее время во фронтенде появляется столько нового и внедряется настолько быстро, что не все успевают осознать последствия. Хорошо это или плохо? Рассмотрим некоторые новинки с точки зрения «за», а главное – «против».
Евгений Батовский, Николай Птущук "Современный станок верстальщика"Yandex
Рассказ о том, что представляет собой наш «станок» верстальщика сегодня. Рассказывается с примерами, какие браузеры поддерживаем, как производим кроссбраузерное тестирование и какие инструменты используем, готовя проект к выходу в свет.
Основные новшества Java 9, которые, на мой взгляд, наиболее актуальны.
Здоровая критика и дополнения приветствуются. Есть текстовый документ, где всё это расписано немного подробнее.
Евгений Жарков "Как быть хорошим фронтенд-разработчиком"Fwdays
Как искать и выбирать оптимальные решения? Для одной задачи подойдет React, для другой - Zepto. Сегодня вы пишите для браузера, завтра думаете, как использовать native-ресурсы iOS.
Не все технологии, которые удобны разработчику, могут дать удобство конечному пользователю.
Я расскажу о балансе, который позволяет бизнесу получать результат, а разработчику - решение.
Выступление на "Найди ответ 6" 20 октября 2012.
Аннотация
Я расскажу о чем нужно знать HR'у и рекрутеру, когда он говорит с IT-профессионалами или теми, кто хочет ими стать. В этой среде много тонкостей и незнакомых "не-IT"-человеку терминов: C++, C#, JavaScript, frontend, backend, Ajax, .NET и так далее.
В последнее время во фронтенде появляется столько нового и внедряется настолько быстро, что не все успевают осознать последствия. Хорошо это или плохо? Рассмотрим некоторые новинки с точки зрения «за», а главное – «против».
Конференция FrontTalks, Екатеринбург, 19 сентября
Видео: https://vimeo.com/107694664
SECON'2016. Сергей Аверин. Javascript-фреймворки: должен остаться только одинSECON
Рассказ от tech-менеджера о том, как мы в Acronis выбирали фреймворк в условиях, когда любое более-менее важное технологическое решение сразу затрагивает с десяток команд, несколько сотен человек и права «случайно все сломать» нет. В докладе пойдет речь о том, что хорошо работающий фронтенд — это больше про слаженную работу команды, про понятный и масштабируемый код, чем про сухие циферки. Но и циферки тоже будут.
1) Какие у нас были проблемы с текущим фреймворком — UI, архитектура, код.
2) Как измеряли, что примерно стоит брать (исследование популярности).
3) Что рассматривали.
4) На пути к демо-проекту, какие были сложности (то, что уперли идею с Typescript, собственный компилятор шаблонов, четыре Flux-фреймворка и все плохи).
5) Два пилотных демо-проекта: цифры.
6) Оценка трудоемкости перехода.
Alexander Shushunov - Let's kill lifecycleMaria Kuneva
Do you hate lifecycle? componentWillReceiveProps make you bored? Let's make React pure again! I will show, how lifecycle brings complexity (and errors) to your code. And how we can avoid it. Or make it more safety.
14. – Продающие системы для интернет-магазинов;
– Прогнозы поведения клиентов;
– Оптимизация производства;
– Анализ показателей из IoT, умного дома;
– Анализ данных как сервис;
– ...
Это может решать конкретную бизнес задачу
15. – Предугадывание действий;
– Помощь пользователю;
– Оценка действий пользователя.
Это может улучшить пользовательский опыт
16. Это может помочь другим вступить
в изучение машинного обучения
https://playground.tensorflow.org
20. WebGL problems:
– Недоступно с некоторыми Intel Built-in graphics, и видеокартами из blacklist-а;
– Трудность разработки под WebGL (особенно 1.0);
– IO Overhead.
23. – Портируемость:
- создан как compilation target;
- может быть запущен на любой архитектуре x64/x86/arm;
– Возможность ручного менеджмента памяти (никаких
проседаний FPS из-за GC);
– Теоретически большая производительность чем у
аналогичного JS кода;
Что дает нам WebAssembly
25. Что WebAssembly даст нам в будущем
– Threads issue#1073
– SharedArrayBuffer - отключен из-за Meltdown и Spectre (что
исключает производительную многопоточность на время для
WASM и JS).
– SIMD issue#1075
– Bulk memory operations issue#1114
26.
27. У нас есть Machine Learning
У нас есть WebAssembly
И что нам делать?
28. Проект позволяет портировать готовые ML модели в веб.
Портирование с:
– Keras;
– PyTorch;
– TensorFlow;
–...
Backend-ы:
– WebAssembly;
– asm.js;
– WebGL;
– WebGPU (Safari with MacOS, iOS);
– JavaScript.
Готовые решения: WebDNN
https://mil-tokyo.github.io/webdnn
33. Популярная OpenSource библиотека, скомпилированная
в WebAssembly с помощью emscripten.
Выигрыш: Портирована большая, готовая, протестированная
кодовая база подготовки данных и выполнения модели
Готовые решения: OpenCV.js
34. Можем ли мы обучить нейронную сеть?
1m 54s 8.373s
https://ai.danruta.co.uk/webassembly (jsNet)
13.7x Faster
vs
41. – JS код и так занимал не больше 2-4ms;
– Вызовы WebAssembly-функций на данный момент
накладывают небольшой overhead;
– Передача данных в память WebAssembly instance-a также
внесла свою долю;
– Среднее отклонение fps стало меньше за счет уменьшения
работы для GC.
Почему так
43. Machine Learning — необходимо развивать инструментарий
WebAssembly
– не серебряная пуля для машинного обучения
– не имеет полного набора выигрышных фич для улучшения
производительности
– требует експериментов
Итог
44. Спасибо за внимание
Экспериментируйте с машинным обучением, с WebAssembly и
делайте наш мир лучше.
И конечно же, задавайте вопросы.
Михаил Зачепило
mihailzachepilo@gmail.compentatonica.co