SlideShare a Scribd company logo
1 of 21
Download to read offline
Real-time данные на
фронтенде
Сергей Рубанов
JavaScript Samurai
Real-time данные на фронтенде
Real-time данные на фронтенде
• Многие баги, которые туда попали однажды и были как-либо
использованы, остаются там навсегда
• Всё в вебе должно иметь обратную совместимость
• Вендоры браузеров не готовы поддерживать все стандарты
• Существуют конкурирующие группы разработки стандартов (w3c,
whatwg) и конкурирующие спецификации
• Сложность спецификаций растет
• Не смотря на значимость принципа обратной совместимости,
вендоры могут убрать поддержку каких-либо Web API в любой
момент (WebSQL, AppCache)
• DOM однопоточный и делит тред с мейн тредом JS, рендеринг
однопоточный
• WebWorker’ы — ограниченные потоки
• не имеют доступа к localStorage
• не имеют доступа к DOM
• требуют использования сериализации или структурного
клонирования (может циклические зависимости, но не может
дескрипторы, геттеры, сеттеры, цепочку прототипов)
• Web Storage синхронный и требует сериализации данных
• IndexedDB имеет много багов в Safari и неполную реализацию в IE
• Нормальных подписок в браузере не существует в принципе
• Изначально содержит баги, которые не могут быть исправлены
• Не был спроектирован для создания приложений
• Практически отсутствующие возможности управления памятью
• Непредсказуемое поведение GC
• Примитивная система типов
• Некоторые типы ошибок нельзя выявить на этапе написания
• Никакая математика
• Условная, во многом ограниченная многопоточность
• Отсутствие разделяемой памяти
JavaScript fatigue
Как не поддаться
JavaScript fatigue
• Принять факт, что все очень плохо
• Использовать статическую проверку типов
(TypeScript и Flow)
• это лучше, чем использовать компиляцию
из других, синтаксически более далеких от
JS языков
• Использовать линтеры (TSLint, ESLint)
Ускоряем JavaScript
• Не используем новые фичи языка (или
транспилируем код в ES5.1)
• Пишем императивный код в стиле Си
• Используем TypedArrays везде, где возможно
• Используем asm.js для математики
• есть оверхед по размеру файла
• нужен разработчик, который умеет C / C++ / Rust
Популярные заблуждения
о фронтенд-разработке
• JavaScript медленный
• DOM медленный
• Чтобы сделать приложение быстрым, надо
переписать его на React (Angular 2 / Preact /
Riot / Vue / etc.)
Как сделать real-time web-
приложения
производительными и
отзывчивыми?
Нужно держать UI-тред
свободным
Canvas?
SVG?
WebGL?
или VanillaJS?
Web Workers
Service Worker
Service Worker
IndexedDB
Real-time данные на фронтенде
Market Data API
https://developers.exante.eu/
Задавайте вопросы!
@chicoxyzzy

More Related Content

What's hot

«Путь джуниора глазами джуниора» - Никита Сердюк
«Путь джуниора глазами джуниора» -  Никита Сердюк«Путь джуниора глазами джуниора» -  Никита Сердюк
«Путь джуниора глазами джуниора» - Никита СердюкITсonnect ITconnect
 
JavaScript завтра / Сергей Рубанов (Exante Limited)
JavaScript завтра / Сергей Рубанов  (Exante Limited)JavaScript завтра / Сергей Рубанов  (Exante Limited)
JavaScript завтра / Сергей Рубанов (Exante Limited)Ontico
 
Инновации и JavaScript
Инновации и JavaScriptИнновации и JavaScript
Инновации и JavaScriptMax Klymyshyn
 
Java script и frontend завтра - Kharkiv JS 2013
Java script и frontend завтра - Kharkiv JS 2013Java script и frontend завтра - Kharkiv JS 2013
Java script и frontend завтра - Kharkiv JS 2013Andrey Listochkin
 
Бэкенд, фронтенд — всё смешалось (nodkz)
Бэкенд, фронтенд — всё смешалось (nodkz)Бэкенд, фронтенд — всё смешалось (nodkz)
Бэкенд, фронтенд — всё смешалось (nodkz)Pavel Chertorogov
 
Full stack веб-разработка используя C# и WebAssembly
Full stack веб-разработка используя C# и WebAssemblyFull stack веб-разработка используя C# и WebAssembly
Full stack веб-разработка используя C# и WebAssemblyAndrei Amialchenia
 
CodeFest 2013. Баяндин А. — JavaScript + Webdriver = ♥
CodeFest 2013. Баяндин А. — JavaScript + Webdriver = ♥CodeFest 2013. Баяндин А. — JavaScript + Webdriver = ♥
CodeFest 2013. Баяндин А. — JavaScript + Webdriver = ♥CodeFest
 
Игры с виртуализацией в JavaScript, или как я переписал эмулятор, Евгений Пот...
Игры с виртуализацией в JavaScript, или как я переписал эмулятор, Евгений Пот...Игры с виртуализацией в JavaScript, или как я переписал эмулятор, Евгений Пот...
Игры с виртуализацией в JavaScript, или как я переписал эмулятор, Евгений Пот...Ontico
 
Performance engineering stories from #fdminicon Saransk
Performance engineering stories from #fdminicon SaranskPerformance engineering stories from #fdminicon Saransk
Performance engineering stories from #fdminicon SaranskAlex Chistyakov
 
Обучение фронтенд разработке
Обучение фронтенд разработкеОбучение фронтенд разработке
Обучение фронтенд разработкеITCrowd Almaty
 
автостопом по багтрекингам
автостопом по багтрекингамавтостопом по багтрекингам
автостопом по багтрекингамSergey Oreshkov
 
Проблемы при работе с разными версиями Ruby и разными gem
Проблемы при работе с разными версиями Ruby и разными gemПроблемы при работе с разными версиями Ruby и разными gem
Проблемы при работе с разными версиями Ruby и разными gemАлександр Ежов
 
Microsoft Edge и платформа веб-приложений в Windows 10 / Константин Кичинский...
Microsoft Edge и платформа веб-приложений в Windows 10 / Константин Кичинский...Microsoft Edge и платформа веб-приложений в Windows 10 / Константин Кичинский...
Microsoft Edge и платформа веб-приложений в Windows 10 / Константин Кичинский...Ontico
 
Современный фронтенд за 30 минут.
Современный фронтенд за 30 минут.Современный фронтенд за 30 минут.
Современный фронтенд за 30 минут.Vladimir Malyk
 
Frontend - экосистема и будущее: iforum 2015
Frontend - экосистема и будущее: iforum 2015Frontend - экосистема и будущее: iforum 2015
Frontend - экосистема и будущее: iforum 2015Eldar Djafarov
 
Павел Юрийчук - Разработка приложений под мобильные браузеры
Павел Юрийчук - Разработка приложений под мобильные браузерыПавел Юрийчук - Разработка приложений под мобильные браузеры
Павел Юрийчук - Разработка приложений под мобильные браузерыUA Mobile
 
Как анимировать тысячи объектов на карте и не подвесить браузер
Как анимировать тысячи объектов на карте и не подвесить браузерКак анимировать тысячи объектов на карте и не подвесить браузер
Как анимировать тысячи объектов на карте и не подвесить браузерDotNetConf
 
Компонентная разработка на Stylus, Jade, Typescript - Леонид Ширманов
Компонентная разработка на Stylus, Jade, Typescript - Леонид ШирмановКомпонентная разработка на Stylus, Jade, Typescript - Леонид Ширманов
Компонентная разработка на Stylus, Jade, Typescript - Леонид ШирмановMoscowJS
 
Python & Web: От простого к сложному
Python & Web: От простого к сложномуPython & Web: От простого к сложному
Python & Web: От простого к сложномуIlya Bolkhovsky
 

What's hot (20)

«Путь джуниора глазами джуниора» - Никита Сердюк
«Путь джуниора глазами джуниора» -  Никита Сердюк«Путь джуниора глазами джуниора» -  Никита Сердюк
«Путь джуниора глазами джуниора» - Никита Сердюк
 
JavaScript завтра / Сергей Рубанов (Exante Limited)
JavaScript завтра / Сергей Рубанов  (Exante Limited)JavaScript завтра / Сергей Рубанов  (Exante Limited)
JavaScript завтра / Сергей Рубанов (Exante Limited)
 
Инновации и JavaScript
Инновации и JavaScriptИнновации и JavaScript
Инновации и JavaScript
 
Java script и frontend завтра - Kharkiv JS 2013
Java script и frontend завтра - Kharkiv JS 2013Java script и frontend завтра - Kharkiv JS 2013
Java script и frontend завтра - Kharkiv JS 2013
 
Бэкенд, фронтенд — всё смешалось (nodkz)
Бэкенд, фронтенд — всё смешалось (nodkz)Бэкенд, фронтенд — всё смешалось (nodkz)
Бэкенд, фронтенд — всё смешалось (nodkz)
 
Full stack веб-разработка используя C# и WebAssembly
Full stack веб-разработка используя C# и WebAssemblyFull stack веб-разработка используя C# и WebAssembly
Full stack веб-разработка используя C# и WebAssembly
 
CodeFest 2013. Баяндин А. — JavaScript + Webdriver = ♥
CodeFest 2013. Баяндин А. — JavaScript + Webdriver = ♥CodeFest 2013. Баяндин А. — JavaScript + Webdriver = ♥
CodeFest 2013. Баяндин А. — JavaScript + Webdriver = ♥
 
Игры с виртуализацией в JavaScript, или как я переписал эмулятор, Евгений Пот...
Игры с виртуализацией в JavaScript, или как я переписал эмулятор, Евгений Пот...Игры с виртуализацией в JavaScript, или как я переписал эмулятор, Евгений Пот...
Игры с виртуализацией в JavaScript, или как я переписал эмулятор, Евгений Пот...
 
Performance engineering stories from #fdminicon Saransk
Performance engineering stories from #fdminicon SaranskPerformance engineering stories from #fdminicon Saransk
Performance engineering stories from #fdminicon Saransk
 
Обучение фронтенд разработке
Обучение фронтенд разработкеОбучение фронтенд разработке
Обучение фронтенд разработке
 
автостопом по багтрекингам
автостопом по багтрекингамавтостопом по багтрекингам
автостопом по багтрекингам
 
Проблемы при работе с разными версиями Ruby и разными gem
Проблемы при работе с разными версиями Ruby и разными gemПроблемы при работе с разными версиями Ruby и разными gem
Проблемы при работе с разными версиями Ruby и разными gem
 
Microsoft Edge и платформа веб-приложений в Windows 10 / Константин Кичинский...
Microsoft Edge и платформа веб-приложений в Windows 10 / Константин Кичинский...Microsoft Edge и платформа веб-приложений в Windows 10 / Константин Кичинский...
Microsoft Edge и платформа веб-приложений в Windows 10 / Константин Кичинский...
 
Современный фронтенд за 30 минут.
Современный фронтенд за 30 минут.Современный фронтенд за 30 минут.
Современный фронтенд за 30 минут.
 
Frontend - экосистема и будущее: iforum 2015
Frontend - экосистема и будущее: iforum 2015Frontend - экосистема и будущее: iforum 2015
Frontend - экосистема и будущее: iforum 2015
 
Павел Юрийчук - Разработка приложений под мобильные браузеры
Павел Юрийчук - Разработка приложений под мобильные браузерыПавел Юрийчук - Разработка приложений под мобильные браузеры
Павел Юрийчук - Разработка приложений под мобильные браузеры
 
Как анимировать тысячи объектов на карте и не подвесить браузер
Как анимировать тысячи объектов на карте и не подвесить браузерКак анимировать тысячи объектов на карте и не подвесить браузер
Как анимировать тысячи объектов на карте и не подвесить браузер
 
knockout.js
knockout.jsknockout.js
knockout.js
 
Компонентная разработка на Stylus, Jade, Typescript - Леонид Ширманов
Компонентная разработка на Stylus, Jade, Typescript - Леонид ШирмановКомпонентная разработка на Stylus, Jade, Typescript - Леонид Ширманов
Компонентная разработка на Stylus, Jade, Typescript - Леонид Ширманов
 
Python & Web: От простого к сложному
Python & Web: От простого к сложномуPython & Web: От простого к сложному
Python & Web: От простого к сложному
 

Viewers also liked

Algorithmic Trading: an Overview
Algorithmic Trading: an Overview Algorithmic Trading: an Overview
Algorithmic Trading: an Overview EXANTE
 
How to Fail and Win in Wealth Management
How to Fail and Win in Wealth ManagementHow to Fail and Win in Wealth Management
How to Fail and Win in Wealth ManagementEXANTE
 
Algorithmic Trading and FIX Protocol
Algorithmic Trading and FIX ProtocolAlgorithmic Trading and FIX Protocol
Algorithmic Trading and FIX ProtocolEXANTE
 
How to Adapt and Prosper in Compliance Age
How to Adapt and Prosper in Compliance AgeHow to Adapt and Prosper in Compliance Age
How to Adapt and Prosper in Compliance AgeEXANTE
 
Exante algotrading
Exante algotradingExante algotrading
Exante algotradingEXANTE
 
Fix protocol an introduction (r motie)
Fix protocol   an introduction (r motie)Fix protocol   an introduction (r motie)
Fix protocol an introduction (r motie)Dr Richard Motie
 
Exante. Народная опционная конференция 2014 (НОК-8). Строим торговую инфрастр...
Exante. Народная опционная конференция 2014 (НОК-8). Строим торговую инфрастр...Exante. Народная опционная конференция 2014 (НОК-8). Строим торговую инфрастр...
Exante. Народная опционная конференция 2014 (НОК-8). Строим торговую инфрастр...EXANTE
 
FIX Protocol Overview.
FIX Protocol Overview.FIX Protocol Overview.
FIX Protocol Overview.aiQUANT
 
EXANTE Algorithmic Trading: Practical Aspects
EXANTE Algorithmic Trading: Practical AspectsEXANTE Algorithmic Trading: Practical Aspects
EXANTE Algorithmic Trading: Practical AspectsEXANTE
 
EXANTE Cross-Asset Portfolio Margin Risk Calculation for Hedge Funds Trading
EXANTE Cross-Asset Portfolio Margin Risk Calculation for Hedge Funds TradingEXANTE Cross-Asset Portfolio Margin Risk Calculation for Hedge Funds Trading
EXANTE Cross-Asset Portfolio Margin Risk Calculation for Hedge Funds TradingEXANTE
 
The Impact of Algorithmic Trading
The Impact of Algorithmic TradingThe Impact of Algorithmic Trading
The Impact of Algorithmic TradingLov Loothra
 
Hedge Fund Review EXANTE 2013 Report
Hedge Fund Review EXANTE 2013 ReportHedge Fund Review EXANTE 2013 Report
Hedge Fund Review EXANTE 2013 ReportEXANTE
 
What is a commodity trading robot
What is a commodity trading robotWhat is a commodity trading robot
What is a commodity trading robotthecommodityrobots
 
Day Trading Robot Review
Day Trading Robot ReviewDay Trading Robot Review
Day Trading Robot ReviewJonas Lee
 
EXANTE: Practical aspects of algorithmic trading. Bitcoin hedge fund. SSE Rig...
EXANTE: Practical aspects of algorithmic trading. Bitcoin hedge fund. SSE Rig...EXANTE: Practical aspects of algorithmic trading. Bitcoin hedge fund. SSE Rig...
EXANTE: Practical aspects of algorithmic trading. Bitcoin hedge fund. SSE Rig...EXANTE
 
王凤仪人生画传
王凤仪人生画传王凤仪人生画传
王凤仪人生画传Neo Mui Kian
 
Programowanie automatycznych strategii transakcyjnych czesc podstawowa
Programowanie automatycznych strategii transakcyjnych   czesc podstawowaProgramowanie automatycznych strategii transakcyjnych   czesc podstawowa
Programowanie automatycznych strategii transakcyjnych czesc podstawowaTomasz Waszczyk
 
trading_automatyczny-waszczyk-probka
trading_automatyczny-waszczyk-probkatrading_automatyczny-waszczyk-probka
trading_automatyczny-waszczyk-probkaTomasz Waszczyk
 
АСДК
АСДКАСДК
АСДКjdanda
 

Viewers also liked (20)

Algorithmic Trading: an Overview
Algorithmic Trading: an Overview Algorithmic Trading: an Overview
Algorithmic Trading: an Overview
 
How to Fail and Win in Wealth Management
How to Fail and Win in Wealth ManagementHow to Fail and Win in Wealth Management
How to Fail and Win in Wealth Management
 
Algorithmic Trading and FIX Protocol
Algorithmic Trading and FIX ProtocolAlgorithmic Trading and FIX Protocol
Algorithmic Trading and FIX Protocol
 
How to Adapt and Prosper in Compliance Age
How to Adapt and Prosper in Compliance AgeHow to Adapt and Prosper in Compliance Age
How to Adapt and Prosper in Compliance Age
 
Exante algotrading
Exante algotradingExante algotrading
Exante algotrading
 
Fix protocol an introduction (r motie)
Fix protocol   an introduction (r motie)Fix protocol   an introduction (r motie)
Fix protocol an introduction (r motie)
 
Exante. Народная опционная конференция 2014 (НОК-8). Строим торговую инфрастр...
Exante. Народная опционная конференция 2014 (НОК-8). Строим торговую инфрастр...Exante. Народная опционная конференция 2014 (НОК-8). Строим торговую инфрастр...
Exante. Народная опционная конференция 2014 (НОК-8). Строим торговую инфрастр...
 
FIX Protocol Overview.
FIX Protocol Overview.FIX Protocol Overview.
FIX Protocol Overview.
 
EXANTE Algorithmic Trading: Practical Aspects
EXANTE Algorithmic Trading: Practical AspectsEXANTE Algorithmic Trading: Practical Aspects
EXANTE Algorithmic Trading: Practical Aspects
 
EXANTE Cross-Asset Portfolio Margin Risk Calculation for Hedge Funds Trading
EXANTE Cross-Asset Portfolio Margin Risk Calculation for Hedge Funds TradingEXANTE Cross-Asset Portfolio Margin Risk Calculation for Hedge Funds Trading
EXANTE Cross-Asset Portfolio Margin Risk Calculation for Hedge Funds Trading
 
The Impact of Algorithmic Trading
The Impact of Algorithmic TradingThe Impact of Algorithmic Trading
The Impact of Algorithmic Trading
 
Hedge Fund Review EXANTE 2013 Report
Hedge Fund Review EXANTE 2013 ReportHedge Fund Review EXANTE 2013 Report
Hedge Fund Review EXANTE 2013 Report
 
What is a commodity trading robot
What is a commodity trading robotWhat is a commodity trading robot
What is a commodity trading robot
 
Day Trading Robot Review
Day Trading Robot ReviewDay Trading Robot Review
Day Trading Robot Review
 
EXANTE: Practical aspects of algorithmic trading. Bitcoin hedge fund. SSE Rig...
EXANTE: Practical aspects of algorithmic trading. Bitcoin hedge fund. SSE Rig...EXANTE: Practical aspects of algorithmic trading. Bitcoin hedge fund. SSE Rig...
EXANTE: Practical aspects of algorithmic trading. Bitcoin hedge fund. SSE Rig...
 
王凤仪人生画传
王凤仪人生画传王凤仪人生画传
王凤仪人生画传
 
Programowanie automatycznych strategii transakcyjnych czesc podstawowa
Programowanie automatycznych strategii transakcyjnych   czesc podstawowaProgramowanie automatycznych strategii transakcyjnych   czesc podstawowa
Programowanie automatycznych strategii transakcyjnych czesc podstawowa
 
trading_automatyczny-waszczyk-probka
trading_automatyczny-waszczyk-probkatrading_automatyczny-waszczyk-probka
trading_automatyczny-waszczyk-probka
 
АСДК
АСДКАСДК
АСДК
 
Ifl
IflIfl
Ifl
 

Similar to Real-time данные на фронтенде

Разгоняем ASP.NET Core / Илья Вербицкий (WebStoating s.r.o.)
Разгоняем ASP.NET Core / Илья Вербицкий (WebStoating s.r.o.)Разгоняем ASP.NET Core / Илья Вербицкий (WebStoating s.r.o.)
Разгоняем ASP.NET Core / Илья Вербицкий (WebStoating s.r.o.)Ontico
 
Оптимизация производительности нагруженных веб-систем на Java
Оптимизация производительности нагруженных веб-систем на JavaОптимизация производительности нагруженных веб-систем на Java
Оптимизация производительности нагруженных веб-систем на JavaAlex Chistyakov
 
Н. Иготти. Виртуализация и виртуальные машины. Лекция 02
Н. Иготти. Виртуализация и виртуальные машины. Лекция 02Н. Иготти. Виртуализация и виртуальные машины. Лекция 02
Н. Иготти. Виртуализация и виртуальные машины. Лекция 02Computer Science Club
 
Как мы строили Jelastic - облачную платформу (PaaS) нового поколения (Дмитрий...
Как мы строили Jelastic - облачную платформу (PaaS) нового поколения (Дмитрий...Как мы строили Jelastic - облачную платформу (PaaS) нового поколения (Дмитрий...
Как мы строили Jelastic - облачную платформу (PaaS) нового поколения (Дмитрий...Ontico
 
Компонентный подход: скучно, неинтересно, бесперспективно
Компонентный подход: скучно, неинтересно, бесперспективноКомпонентный подход: скучно, неинтересно, бесперспективно
Компонентный подход: скучно, неинтересно, бесперспективноRoman Dvornov
 
Опыт эксплуатации большого проекта на Ruby
Опыт эксплуатации большого проекта на RubyОпыт эксплуатации большого проекта на Ruby
Опыт эксплуатации большого проекта на RubyAlex Chistyakov
 
Multithreading in JS. Myth or reality?
Multithreading in JS. Myth or reality?Multithreading in JS. Myth or reality?
Multithreading in JS. Myth or reality?Alexander Syrotenko
 
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)Badoo Development
 
Облако в Badoo год спустя
Облако в Badoo год спустяОблако в Badoo год спустя
Облако в Badoo год спустяYuriy Nasretdinov
 
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)Ontico
 
Корпоративное приложение на Rails
Корпоративное приложение на RailsКорпоративное приложение на Rails
Корпоративное приложение на RailsАндрей Колешко
 
20 апреля, DEV {highload}, "Демоны в большом проекте – проблемы и их решения ...
20 апреля, DEV {highload}, "Демоны в большом проекте – проблемы и их решения ...20 апреля, DEV {highload}, "Демоны в большом проекте – проблемы и их решения ...
20 апреля, DEV {highload}, "Демоны в большом проекте – проблемы и их решения ...IT-Portfolio
 
Daemons In Web on #devrus
Daemons In Web on #devrusDaemons In Web on #devrus
Daemons In Web on #devrusAlex Chistyakov
 
Excelsior JET в действии
Excelsior JET в действииExcelsior JET в действии
Excelsior JET в действииNikita Lipsky
 
Javascript-фреймворки: должен остаться только один / Аверин Сергей (Acronis)
Javascript-фреймворки: должен остаться только один / Аверин Сергей (Acronis)Javascript-фреймворки: должен остаться только один / Аверин Сергей (Acronis)
Javascript-фреймворки: должен остаться только один / Аверин Сергей (Acronis)Ontico
 
Javascript-фреймворки:
 должен остаться только один
Javascript-фреймворки:
 должен остаться только одинJavascript-фреймворки:
 должен остаться только один
Javascript-фреймворки:
 должен остаться только одинSergey Xek
 

Similar to Real-time данные на фронтенде (20)

Разгоняем ASP.NET Core / Илья Вербицкий (WebStoating s.r.o.)
Разгоняем ASP.NET Core / Илья Вербицкий (WebStoating s.r.o.)Разгоняем ASP.NET Core / Илья Вербицкий (WebStoating s.r.o.)
Разгоняем ASP.NET Core / Илья Вербицкий (WebStoating s.r.o.)
 
Sivko
SivkoSivko
Sivko
 
Оптимизация производительности нагруженных веб-систем на Java
Оптимизация производительности нагруженных веб-систем на JavaОптимизация производительности нагруженных веб-систем на Java
Оптимизация производительности нагруженных веб-систем на Java
 
Н. Иготти. Виртуализация и виртуальные машины. Лекция 02
Н. Иготти. Виртуализация и виртуальные машины. Лекция 02Н. Иготти. Виртуализация и виртуальные машины. Лекция 02
Н. Иготти. Виртуализация и виртуальные машины. Лекция 02
 
Mobile web apps
Mobile web appsMobile web apps
Mobile web apps
 
Как мы строили Jelastic - облачную платформу (PaaS) нового поколения (Дмитрий...
Как мы строили Jelastic - облачную платформу (PaaS) нового поколения (Дмитрий...Как мы строили Jelastic - облачную платформу (PaaS) нового поколения (Дмитрий...
Как мы строили Jelastic - облачную платформу (PaaS) нового поколения (Дмитрий...
 
Компонентный подход: скучно, неинтересно, бесперспективно
Компонентный подход: скучно, неинтересно, бесперспективноКомпонентный подход: скучно, неинтересно, бесперспективно
Компонентный подход: скучно, неинтересно, бесперспективно
 
WebAssembly
WebAssemblyWebAssembly
WebAssembly
 
Опыт эксплуатации большого проекта на Ruby
Опыт эксплуатации большого проекта на RubyОпыт эксплуатации большого проекта на Ruby
Опыт эксплуатации большого проекта на Ruby
 
Migrate!
Migrate!Migrate!
Migrate!
 
Multithreading in JS. Myth or reality?
Multithreading in JS. Myth or reality?Multithreading in JS. Myth or reality?
Multithreading in JS. Myth or reality?
 
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)
 
Облако в Badoo год спустя
Облако в Badoo год спустяОблако в Badoo год спустя
Облако в Badoo год спустя
 
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)
Облако в Badoo год спустя - работа над ошибками, Юрий Насретдинов (Badoo)
 
Корпоративное приложение на Rails
Корпоративное приложение на RailsКорпоративное приложение на Rails
Корпоративное приложение на Rails
 
20 апреля, DEV {highload}, "Демоны в большом проекте – проблемы и их решения ...
20 апреля, DEV {highload}, "Демоны в большом проекте – проблемы и их решения ...20 апреля, DEV {highload}, "Демоны в большом проекте – проблемы и их решения ...
20 апреля, DEV {highload}, "Демоны в большом проекте – проблемы и их решения ...
 
Daemons In Web on #devrus
Daemons In Web on #devrusDaemons In Web on #devrus
Daemons In Web on #devrus
 
Excelsior JET в действии
Excelsior JET в действииExcelsior JET в действии
Excelsior JET в действии
 
Javascript-фреймворки: должен остаться только один / Аверин Сергей (Acronis)
Javascript-фреймворки: должен остаться только один / Аверин Сергей (Acronis)Javascript-фреймворки: должен остаться только один / Аверин Сергей (Acronis)
Javascript-фреймворки: должен остаться только один / Аверин Сергей (Acronis)
 
Javascript-фреймворки:
 должен остаться только один
Javascript-фреймворки:
 должен остаться только одинJavascript-фреймворки:
 должен остаться только один
Javascript-фреймворки:
 должен остаться только один
 

Real-time данные на фронтенде

  • 4. • Многие баги, которые туда попали однажды и были как-либо использованы, остаются там навсегда • Всё в вебе должно иметь обратную совместимость • Вендоры браузеров не готовы поддерживать все стандарты • Существуют конкурирующие группы разработки стандартов (w3c, whatwg) и конкурирующие спецификации • Сложность спецификаций растет • Не смотря на значимость принципа обратной совместимости, вендоры могут убрать поддержку каких-либо Web API в любой момент (WebSQL, AppCache)
  • 5. • DOM однопоточный и делит тред с мейн тредом JS, рендеринг однопоточный • WebWorker’ы — ограниченные потоки • не имеют доступа к localStorage • не имеют доступа к DOM • требуют использования сериализации или структурного клонирования (может циклические зависимости, но не может дескрипторы, геттеры, сеттеры, цепочку прототипов) • Web Storage синхронный и требует сериализации данных • IndexedDB имеет много багов в Safari и неполную реализацию в IE • Нормальных подписок в браузере не существует в принципе
  • 6. • Изначально содержит баги, которые не могут быть исправлены • Не был спроектирован для создания приложений • Практически отсутствующие возможности управления памятью • Непредсказуемое поведение GC • Примитивная система типов • Некоторые типы ошибок нельзя выявить на этапе написания • Никакая математика • Условная, во многом ограниченная многопоточность • Отсутствие разделяемой памяти
  • 8. Как не поддаться JavaScript fatigue • Принять факт, что все очень плохо • Использовать статическую проверку типов (TypeScript и Flow) • это лучше, чем использовать компиляцию из других, синтаксически более далеких от JS языков • Использовать линтеры (TSLint, ESLint)
  • 9. Ускоряем JavaScript • Не используем новые фичи языка (или транспилируем код в ES5.1) • Пишем императивный код в стиле Си • Используем TypedArrays везде, где возможно • Используем asm.js для математики • есть оверхед по размеру файла • нужен разработчик, который умеет C / C++ / Rust
  • 10. Популярные заблуждения о фронтенд-разработке • JavaScript медленный • DOM медленный • Чтобы сделать приложение быстрым, надо переписать его на React (Angular 2 / Preact / Riot / Vue / etc.)
  • 11. Как сделать real-time web- приложения производительными и отзывчивыми?

Editor's Notes

  1. Почему вся платформа сломана
  2. Почему энвайронтменты сломаны long-polling FTW
  3. JavaScript
  4. tech preview для RU с регистрацией и доступом к API демо — через неделю (через статью-учебник и анонс на хабре + оповещение тем кто оставит мыло) полный запуск в начале января