Enviar pesquisa
Carregar
Dump-IT Загрузка и инициализация JavaScript
•
0 gostou
•
730 visualizações
Mikhail Davydov
Seguir
Dump-IT Загрузка и инициализация JavaScript
Leia menos
Leia mais
Tecnologia
Denunciar
Compartilhar
Denunciar
Compartilhar
1 de 30
Baixar agora
Baixar para ler offline
Recomendados
Конструктор / Денис Паясь (Яндекс)
Конструктор / Денис Паясь (Яндекс)
Ontico
#11 "Отзывчивый UI без блокировки Event Loop" Денис Речкунов
#11 "Отзывчивый UI без блокировки Event Loop" Денис Речкунов
JSib
#6 "Изоморфный фреймворк Catberry.js" Денис Речкунов
#6 "Изоморфный фреймворк Catberry.js" Денис Речкунов
JSib
"Prom.ua shopping cart workflow as a microfrontend", Danylo Kazymyrov
"Prom.ua shopping cart workflow as a microfrontend", Danylo Kazymyrov
Fwdays
Знакомство с WebAssembly
Знакомство с WebAssembly
Nikita Zimin
non-blocking java script
non-blocking java script
Ecommerce Solution Provider SysIQ
base.network — пиринговый веб на JavaScript / Денис Глазков (Lazada Rus)
base.network — пиринговый веб на JavaScript / Денис Глазков (Lazada Rus)
Ontico
#5 "React.js" Антон Артамонов
#5 "React.js" Антон Артамонов
JSib
Recomendados
Конструктор / Денис Паясь (Яндекс)
Конструктор / Денис Паясь (Яндекс)
Ontico
#11 "Отзывчивый UI без блокировки Event Loop" Денис Речкунов
#11 "Отзывчивый UI без блокировки Event Loop" Денис Речкунов
JSib
#6 "Изоморфный фреймворк Catberry.js" Денис Речкунов
#6 "Изоморфный фреймворк Catberry.js" Денис Речкунов
JSib
"Prom.ua shopping cart workflow as a microfrontend", Danylo Kazymyrov
"Prom.ua shopping cart workflow as a microfrontend", Danylo Kazymyrov
Fwdays
Знакомство с WebAssembly
Знакомство с WebAssembly
Nikita Zimin
non-blocking java script
non-blocking java script
Ecommerce Solution Provider SysIQ
base.network — пиринговый веб на JavaScript / Денис Глазков (Lazada Rus)
base.network — пиринговый веб на JavaScript / Денис Глазков (Lazada Rus)
Ontico
#5 "React.js" Антон Артамонов
#5 "React.js" Антон Артамонов
JSib
Колёса: Раньше и сейчас. Как поменять архитектуру высоконагруженного проекта
Колёса: Раньше и сейчас. Как поменять архитектуру высоконагруженного проекта
ITCrowd Almaty
Разработка API для большого, нагруженного сервиса
Разработка API для большого, нагруженного сервиса
endeveit
Современный фронтенд -- как не утонуть в море хайпа?
Современный фронтенд -- как не утонуть в море хайпа?
Vladimir Malyk
Инфраструктура распределенных приложений на Node.js
Инфраструктура распределенных приложений на Node.js
Stanislav Gumeniuk
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
Ontico
Vagrant puppet
Vagrant puppet
Peri Innovations
Сергей Яковлев "Phalcon 2 - стабилизация и производительность"
Сергей Яковлев "Phalcon 2 - стабилизация и производительность"
Fwdays
Node.js (RichClient)
Node.js (RichClient)
Serge Shirokov
Как сделать проект с 1 500 000 просмотров в сутки, который не ломается - IzhD...
Как сделать проект с 1 500 000 просмотров в сутки, который не ломается - IzhD...
Egor Konovalov
Maven 3 : уличная магия
Maven 3 : уличная магия
Aleksey Solntsev
Maven как средство сборки проекта
Maven как средство сборки проекта
Yova Stoika
Переезжаем с Zabbix на Prometheus / Василий Озеров (fevlake)
Переезжаем с Zabbix на Prometheus / Василий Озеров (fevlake)
Ontico
Быстрый рендеринг с DOM шаблонизаторами / Борис Каплуновский (aviasales.ru)
Быстрый рендеринг с DOM шаблонизаторами / Борис Каплуновский (aviasales.ru)
Ontico
RootConf 2015: Как Vagrant и Chef ускорили разработку в несколько раз
RootConf 2015: Как Vagrant и Chef ускорили разработку в несколько раз
Timur Batyrshin
QA MeetUp - Тимур Батыршин: "Тестирование серверной конфигурации"
QA MeetUp - Тимур Батыршин: "Тестирование серверной конфигурации"
Provectus
Cистемы автоматической сборки проектов (Полина Фоминых)
Cистемы автоматической сборки проектов (Полина Фоминых)
Кафедра высокопроизводительных компьютерных технологий ИМКН УрФУ
#12 "Создание двух desktop приложений на node-webkit и Electron” Михаил Реенко
#12 "Создание двух desktop приложений на node-webkit и Electron” Михаил Реенко
JSib
QA Fest 2019. Александр Хотемской. WebdriverIO + Puppeteer. Double gun - doub...
QA Fest 2019. Александр Хотемской. WebdriverIO + Puppeteer. Double gun - doub...
QAFest
Стажировка-2014, занятие 8. Обзор Sails framework (Node.js)
Стажировка-2014, занятие 8. Обзор Sails framework (Node.js)
7bits
Алексей Фомкин, Практическое применение Web Workers
Алексей Фомкин, Практическое применение Web Workers
Aleksey Fomkin
JavaScript. Basics (in russian)
JavaScript. Basics (in russian)
Mikhail Davydov
JavaScript. Loops and functions (in russian)
JavaScript. Loops and functions (in russian)
Mikhail Davydov
Mais conteúdo relacionado
Mais procurados
Колёса: Раньше и сейчас. Как поменять архитектуру высоконагруженного проекта
Колёса: Раньше и сейчас. Как поменять архитектуру высоконагруженного проекта
ITCrowd Almaty
Разработка API для большого, нагруженного сервиса
Разработка API для большого, нагруженного сервиса
endeveit
Современный фронтенд -- как не утонуть в море хайпа?
Современный фронтенд -- как не утонуть в море хайпа?
Vladimir Malyk
Инфраструктура распределенных приложений на Node.js
Инфраструктура распределенных приложений на Node.js
Stanislav Gumeniuk
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
Ontico
Vagrant puppet
Vagrant puppet
Peri Innovations
Сергей Яковлев "Phalcon 2 - стабилизация и производительность"
Сергей Яковлев "Phalcon 2 - стабилизация и производительность"
Fwdays
Node.js (RichClient)
Node.js (RichClient)
Serge Shirokov
Как сделать проект с 1 500 000 просмотров в сутки, который не ломается - IzhD...
Как сделать проект с 1 500 000 просмотров в сутки, который не ломается - IzhD...
Egor Konovalov
Maven 3 : уличная магия
Maven 3 : уличная магия
Aleksey Solntsev
Maven как средство сборки проекта
Maven как средство сборки проекта
Yova Stoika
Переезжаем с Zabbix на Prometheus / Василий Озеров (fevlake)
Переезжаем с Zabbix на Prometheus / Василий Озеров (fevlake)
Ontico
Быстрый рендеринг с DOM шаблонизаторами / Борис Каплуновский (aviasales.ru)
Быстрый рендеринг с DOM шаблонизаторами / Борис Каплуновский (aviasales.ru)
Ontico
RootConf 2015: Как Vagrant и Chef ускорили разработку в несколько раз
RootConf 2015: Как Vagrant и Chef ускорили разработку в несколько раз
Timur Batyrshin
QA MeetUp - Тимур Батыршин: "Тестирование серверной конфигурации"
QA MeetUp - Тимур Батыршин: "Тестирование серверной конфигурации"
Provectus
Cистемы автоматической сборки проектов (Полина Фоминых)
Cистемы автоматической сборки проектов (Полина Фоминых)
Кафедра высокопроизводительных компьютерных технологий ИМКН УрФУ
#12 "Создание двух desktop приложений на node-webkit и Electron” Михаил Реенко
#12 "Создание двух desktop приложений на node-webkit и Electron” Михаил Реенко
JSib
QA Fest 2019. Александр Хотемской. WebdriverIO + Puppeteer. Double gun - doub...
QA Fest 2019. Александр Хотемской. WebdriverIO + Puppeteer. Double gun - doub...
QAFest
Стажировка-2014, занятие 8. Обзор Sails framework (Node.js)
Стажировка-2014, занятие 8. Обзор Sails framework (Node.js)
7bits
Алексей Фомкин, Практическое применение Web Workers
Алексей Фомкин, Практическое применение Web Workers
Aleksey Fomkin
Mais procurados
(20)
Колёса: Раньше и сейчас. Как поменять архитектуру высоконагруженного проекта
Колёса: Раньше и сейчас. Как поменять архитектуру высоконагруженного проекта
Разработка API для большого, нагруженного сервиса
Разработка API для большого, нагруженного сервиса
Современный фронтенд -- как не утонуть в море хайпа?
Современный фронтенд -- как не утонуть в море хайпа?
Инфраструктура распределенных приложений на Node.js
Инфраструктура распределенных приложений на Node.js
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
Как мы разрабатываем новый фронтенд / Филипп Нехаев (Tinkoff.ru)
Vagrant puppet
Vagrant puppet
Сергей Яковлев "Phalcon 2 - стабилизация и производительность"
Сергей Яковлев "Phalcon 2 - стабилизация и производительность"
Node.js (RichClient)
Node.js (RichClient)
Как сделать проект с 1 500 000 просмотров в сутки, который не ломается - IzhD...
Как сделать проект с 1 500 000 просмотров в сутки, который не ломается - IzhD...
Maven 3 : уличная магия
Maven 3 : уличная магия
Maven как средство сборки проекта
Maven как средство сборки проекта
Переезжаем с Zabbix на Prometheus / Василий Озеров (fevlake)
Переезжаем с Zabbix на Prometheus / Василий Озеров (fevlake)
Быстрый рендеринг с DOM шаблонизаторами / Борис Каплуновский (aviasales.ru)
Быстрый рендеринг с DOM шаблонизаторами / Борис Каплуновский (aviasales.ru)
RootConf 2015: Как Vagrant и Chef ускорили разработку в несколько раз
RootConf 2015: Как Vagrant и Chef ускорили разработку в несколько раз
QA MeetUp - Тимур Батыршин: "Тестирование серверной конфигурации"
QA MeetUp - Тимур Батыршин: "Тестирование серверной конфигурации"
Cистемы автоматической сборки проектов (Полина Фоминых)
Cистемы автоматической сборки проектов (Полина Фоминых)
#12 "Создание двух desktop приложений на node-webkit и Electron” Михаил Реенко
#12 "Создание двух desktop приложений на node-webkit и Electron” Михаил Реенко
QA Fest 2019. Александр Хотемской. WebdriverIO + Puppeteer. Double gun - doub...
QA Fest 2019. Александр Хотемской. WebdriverIO + Puppeteer. Double gun - doub...
Стажировка-2014, занятие 8. Обзор Sails framework (Node.js)
Стажировка-2014, занятие 8. Обзор Sails framework (Node.js)
Алексей Фомкин, Практическое применение Web Workers
Алексей Фомкин, Практическое применение Web Workers
Destaque
JavaScript. Basics (in russian)
JavaScript. Basics (in russian)
Mikhail Davydov
JavaScript. Loops and functions (in russian)
JavaScript. Loops and functions (in russian)
Mikhail Davydov
JavaScript. Event Loop and Timers (in russian)
JavaScript. Event Loop and Timers (in russian)
Mikhail Davydov
Ajax and Transports (in russian)
Ajax and Transports (in russian)
Mikhail Davydov
JavaScript. OOP (in russian)
JavaScript. OOP (in russian)
Mikhail Davydov
Dart - светлая сторона силы?
Dart - светлая сторона силы?
Mikhail Davydov
Components now! (in russian)
Components now! (in russian)
Mikhail Davydov
Introduction in Node.js (in russian)
Introduction in Node.js (in russian)
Mikhail Davydov
JavaScript. Event Model (in russian)
JavaScript. Event Model (in russian)
Mikhail Davydov
JavaScript. Async (in Russian)
JavaScript. Async (in Russian)
Mikhail Davydov
Components now!
Components now!
Mikhail Davydov
Destaque
(11)
JavaScript. Basics (in russian)
JavaScript. Basics (in russian)
JavaScript. Loops and functions (in russian)
JavaScript. Loops and functions (in russian)
JavaScript. Event Loop and Timers (in russian)
JavaScript. Event Loop and Timers (in russian)
Ajax and Transports (in russian)
Ajax and Transports (in russian)
JavaScript. OOP (in russian)
JavaScript. OOP (in russian)
Dart - светлая сторона силы?
Dart - светлая сторона силы?
Components now! (in russian)
Components now! (in russian)
Introduction in Node.js (in russian)
Introduction in Node.js (in russian)
JavaScript. Event Model (in russian)
JavaScript. Event Model (in russian)
JavaScript. Async (in Russian)
JavaScript. Async (in Russian)
Components now!
Components now!
Semelhante a Dump-IT Загрузка и инициализация JavaScript
Изоморфные react-приложения
Изоморфные react-приложения
Denis Izmaylov
Симаков Алексей - Системы управления кластерами
Симаков Алексей - Системы управления кластерами
Yandex
Системы автоматизированной сборки (Lecture 05 – gradle)
Системы автоматизированной сборки (Lecture 05 – gradle)
Noveo
"Изоморфный D3 + MALEVICH", Алексей Охрименко, MoscowJS 25
"Изоморфный D3 + MALEVICH", Алексей Охрименко, MoscowJS 25
MoscowJS
GitLab, Prometheus и Grafana с Kubernetes
GitLab, Prometheus и Grafana с Kubernetes
Victor Login
Moscow js 26 webpack
Moscow js 26 webpack
lgordey
MoscowJS 26 webpack presentation
MoscowJS 26 webpack presentation
lgordey
Денис Измайлов, JavaScript сегодня: React, Redux и новая реальность
Денис Измайлов, JavaScript сегодня: React, Redux и новая реальность
ScrumTrek
JavaScript сегодня: React, Redux и новая реальность
JavaScript сегодня: React, Redux и новая реальность
Denis Izmaylov
Движение по хрупкому дну / Сергей Караткевич (servers.ru)
Движение по хрупкому дну / Сергей Караткевич (servers.ru)
Ontico
#3 "Webpack и Vue.JS: Создание больших приложений и их расширение" Кирилл Кай...
#3 "Webpack и Vue.JS: Создание больших приложений и их расширение" Кирилл Кай...
JSib
2017-03-11 01 Игорь Родионов. Docker swarm vs Kubernetes
2017-03-11 01 Игорь Родионов. Docker swarm vs Kubernetes
Омские ИТ-субботники
Ruby gui
Ruby gui
Alexander Kirillov
Регрессионное тестирование на lenta.ru, Кондратенко Павел, Rambler&Co, Moscow...
Регрессионное тестирование на lenta.ru, Кондратенко Павел, Rambler&Co, Moscow...
MoscowJS
Jiramania презентации @augspb
Jiramania презентации @augspb
Gonchik Tsymzhitov
Изоморфные React-приложения производительность и масштабирование / Денис Изма...
Изоморфные React-приложения производительность и масштабирование / Денис Изма...
Ontico
Процесс разработки и тестирования с Docker + gitlab ci
Процесс разработки и тестирования с Docker + gitlab ci
Александр Сигачев
JavaScript-модули "из прошлого в будущее"
JavaScript-модули "из прошлого в будущее"
oelifantiev
Презентация «WebMarkupMin – HTML-минификатор для платформы .NET» с MskDotNet ...
Презентация «WebMarkupMin – HTML-минификатор для платформы .NET» с MskDotNet ...
Andrey Taritsyn
Владимир Кузнецов — Прототип сайта: разработка и развёртывание
Владимир Кузнецов — Прототип сайта: разработка и развёртывание
Yandex
Semelhante a Dump-IT Загрузка и инициализация JavaScript
(20)
Изоморфные react-приложения
Изоморфные react-приложения
Симаков Алексей - Системы управления кластерами
Симаков Алексей - Системы управления кластерами
Системы автоматизированной сборки (Lecture 05 – gradle)
Системы автоматизированной сборки (Lecture 05 – gradle)
"Изоморфный D3 + MALEVICH", Алексей Охрименко, MoscowJS 25
"Изоморфный D3 + MALEVICH", Алексей Охрименко, MoscowJS 25
GitLab, Prometheus и Grafana с Kubernetes
GitLab, Prometheus и Grafana с Kubernetes
Moscow js 26 webpack
Moscow js 26 webpack
MoscowJS 26 webpack presentation
MoscowJS 26 webpack presentation
Денис Измайлов, JavaScript сегодня: React, Redux и новая реальность
Денис Измайлов, JavaScript сегодня: React, Redux и новая реальность
JavaScript сегодня: React, Redux и новая реальность
JavaScript сегодня: React, Redux и новая реальность
Движение по хрупкому дну / Сергей Караткевич (servers.ru)
Движение по хрупкому дну / Сергей Караткевич (servers.ru)
#3 "Webpack и Vue.JS: Создание больших приложений и их расширение" Кирилл Кай...
#3 "Webpack и Vue.JS: Создание больших приложений и их расширение" Кирилл Кай...
2017-03-11 01 Игорь Родионов. Docker swarm vs Kubernetes
2017-03-11 01 Игорь Родионов. Docker swarm vs Kubernetes
Ruby gui
Ruby gui
Регрессионное тестирование на lenta.ru, Кондратенко Павел, Rambler&Co, Moscow...
Регрессионное тестирование на lenta.ru, Кондратенко Павел, Rambler&Co, Moscow...
Jiramania презентации @augspb
Jiramania презентации @augspb
Изоморфные React-приложения производительность и масштабирование / Денис Изма...
Изоморфные React-приложения производительность и масштабирование / Денис Изма...
Процесс разработки и тестирования с Docker + gitlab ci
Процесс разработки и тестирования с Docker + gitlab ci
JavaScript-модули "из прошлого в будущее"
JavaScript-модули "из прошлого в будущее"
Презентация «WebMarkupMin – HTML-минификатор для платформы .NET» с MskDotNet ...
Презентация «WebMarkupMin – HTML-минификатор для платформы .NET» с MskDotNet ...
Владимир Кузнецов — Прототип сайта: разработка и развёртывание
Владимир Кузнецов — Прототип сайта: разработка и развёртывание
Dump-IT Загрузка и инициализация JavaScript
1.
Загрузка и инициализация JavaScript
приложения Михаил Давыдов @azproduction JavaScript и Node.js разработчик Dump-IT, Екатеринбург, 25 мая 2012
2.
Мобильный веб 2
3.
40
% Не весь код используется 3
4.
Браузерный кэш 4
5.
Тестовый прототип, 7
Кб/с http://tinyurl.com/loader-test 5
6.
Последовательная загрузка и
исполнение <script src="main.js"> </script> <script src="module.js"> </script> 6
7.
9 Запросов
131.5 Кб 18 с DOM 17.5 c 7
8.
Параллельная загрузка и
исполнение <script src="main.js" async> </script> <script src="module.js" async> </script> 8
9.
9 Запросов
131.5 Кб 18 с DOM 1.5 c 9
10.
Параллельная загрузка, последовательный
запуск $LAB .script('main.js') .wait() .script('module.js'); http://labjs.com/ 10
11.
10 Запросов
↑1 136.9 Кб ↑5.4 18.2 с ↑0.2 DOM 3.7 c 11
12.
Собираем и пакуем
$ cat **/*.js > main.js $ java -jar yuicompressor.jar main.js -o main.min.js http://tinyurl.com/yui-compressor 12
13.
6 Запросов
↓3 48 Кб ↓83.5 9.5 с ↓8.5 DOM 9.1 c 13
14.
AppCache — оффлайн
хранилище 14
15.
AppCache Манифест <html
manifest="example.appcache"> </html> CACHE MANIFEST # v1 - 2011-08-13 http://example.com/index.html http://example.com/main.js 15
16.
Преимущества AppCache 1. Надежное
кэширование 2. Работа оффлайн 3. Простое управление версиями 4. Своевременное обновление http://tinyurl.com/mdn-appcache 16
17.
Кэш — 0
запросов, 0 Кб 17
18.
Выборочная загрузка
AMD — Асинхронная декларация модулей http://requirejs.org/ 18
19.
Преимущества АMD 1. Грузим
основные части 2. Остальное по необходимости 3. Автодогрузка зависимостей 4. ... 5. PROFIT 19
20.
8 Запросов
+2 ↑2 31.5 +30 Кб ↓16.5 7.4 с +4 c ↓2.1 DOM 5.1 c 20
21.
Ленивая загрузка и
инициализация LMD — Ленивая декларация модулей https://github.com/azproduction/lmd 21
22.
Преимущества LMD 1. Ленивая
инициализация 2. Node.js-подобные модули 3. Встроенный сборщик и упаковщик 4. Гибкий объем библиотеки 5. Горячая сборка проекта 22
23.
6 Запросов
+2 ↓2 18 +30 Кб ↓13.5 5.1 с +4 c ↓2.3 DOM 5.1 c 23
24.
6 Запросов
9 ↓3 18 131.5 Кб ↓113 5.1 с 18 с ↓12.9 DOM 5.1 c 24
25.
1. Используйте AppCache
+ http://tinyurl.com/mdn-appcache http://tinyurl.com/confessjs 2. Соберите скрипты 3. LMD или AMD 25
26.
1. Используйте AppCache 2.
Соберите скрипты + http://tinyurl.com/yui-compressor 3. LMD или AMD 26
27.
1. Используйте AppCache 2.
Соберите скрипты + 3. LMD или AMD https://github.com/azproduction/lmd http://requirejs.org/ 27
28.
OVER 9000
JS Achievement unlocked! 28
29.
Вопросы? Тест http://tinyurl.com/loader-test LMD
https://github.com/azproduction/lmd Confess http://tinyurl.com/confessjs Require http://requirejs.org/ YUIC http://tinyurl.com/yui-compressor CanIUse http://caniuse.com/ 29
30.
Михаил Давыдов
JavaScript и Node.js разработчик azproduction@yandex-team.ru Twitter @azproduction Habr http://azproduction.habrahabr.ru GitHub https://github.com/azproduction 30
Baixar agora