SlideShare a Scribd company logo
JavaScript на сервере,
1ms на трансформацию

   Андрей Сумин, Mail.ru
Зачем?
Зачем?
— Пишут одни, а используют другие
Зачем?
— Пишут одни, а используют другие
— JavaScript специалисты
Зачем?
— Пишут одни, а используют другие
— JavaScript специалисты
— Шаблонизация на клиенте
Что нужно
XSLT JS
XSLT JS
XSLT
/head.xml
   <title><fest:get name="title"/></title>
   <fest:set name="title">Mail.ru</fest:set>
XSLT
/head.xml
   <title><fest:get name="title"/></title>
   <fest:set name="title">Mail.ru</fest:set>
/mail.xml
   <fest:include src="head.xml"/>
   <fest:set name="title">Почта</fest:set>
JavaScript
<fest:script>
   var text = "mail.ru"
</fest:script>
<fest:value>text</fest:value>
JavaScript
<fest:script>
   var text = "mail.ru"
</fest:script>
<fest:value>text</fest:value>

mail.ru
XML
XML
— IDE
XML
— IDE
— Валидация из коробки
XML
— IDE
— Валидация из коробки
— Name spaces
XML
— IDE
— Валидация из коробки
— Name spaces
— SAX, XSLT, XSD, DTD …
XML
— IDE
— Валидация из коробки
— Name spaces
— SAX, XSLT, XSD, DTD ...
— XML to XML
Реализация
Ковбойство
Структура
    vs
Функция
Структура vs функция
[ {action:"template"},
  "<html>...",
  {action:"value"},
  "json.value"]
Структура vs функция
[ {action:"template"},
  "<html>....”,
  {action:"if"},
  "json.value",
  "<span>true</span>",
  "<span>false</span>"]
Структура vs функция
function template(json){
   var html = "";
   html += "<html>…";
   html += json.value;
   return html;
}
Структура vs функция
200ms
3ms
Структура vs функция
fest:forearch   for(i = 0; i < l; i++) {}
fest:if         if(value) {}
fest:choose     if(value) {} else {}

fest:set        set[name] = function
                set[name] = function
Структура vs функция
<span>        html += "<span>";
    mail.ru   html += "mail.ru";
</span>       html += "</span>";
Структура vs функция
<span>        html += "<span>";
    mail.ru   html += "mail.ru";
</span>       html += "</span>";

html += "<span>mail.ru</span>";
30%
Безопасность
try catch
try catch
 escape
Безопасность
<fest:value>json.name</fest:value>
try {
    html += escape(json.name);
} catch(e) {
    log(e.message);
}
Интеграция
Интеграция
—С
— Perl
— Python
— NodeJS
Интеграция
—С         fest_log
— Perl     fest_file
— Python   fest_dirname
— NodeJS
Интеграция
—С          fest_log
— Perl      fest_file
— Python    fest_dirname
— NodeJS

— Браузер
Реальные
пользователи
4ms
Реальные пользователи
msg_length = 5
msg_1_title = "letter"
msg_1_Unread = 1
Реальные пользователи
msg_length = 5
msg_1_title = "letter"
msg_1_Unread = 1

msg = [ {title: "letter", Unread: true} ]
Реальные пользователи
hash -> v8 api -> JavaScript
hash -> string -> JSON.parse -> JavaScript
hash -> string -> compile -> Javascript
Реальные пользователи
Local<String> script = String::new(
   "template("{value:'mail.ru'}")"
);
Local<Script> cs = Script::Compile( script );
Local<Value> result = cs->Run();
2 + 4 = 6ms
67%
NodeJS
NodeJS 4ms
Реальные пользователи
msg_length = 5
msg_1_title = "letter"
msg_1_Unread = 1
Реальные пользователи
msg_length = 5
msg_1_title = "letter"
msg_1_Unread = 1


get('msg_' + i + '_title')
3ms
Реальные пользователи
30 часов одно ядро 2.2 ГГц Xeon
10 000 000+ хитов
1.6ms среднее время трансформации
992 422 10% между       2 и 5ms
208 464 2% между        5 и 10ms
396 49 0,4% больше 10ms
Продакшен,
  главная
50% x3
65+100=165кб
RB lite v8 lite
Почти продакшен
html += "foo";
html += rb(id);
html += "bar";
Почти продакшен
html += "foo";    push_string("foo");
html += rb(id);   push_rb(id);
html += "bar";    push_string("bar");
50% x2
440 000 000
440 000 000
110 000 000
Выступление Андрея Сумина, Mail.Ru Group, на High Performance Conference
Данные на февраль 2012 года
Размер HTML, который генерирует v8 65кб.

Время, работы v8 на запрос 1ms.

В среднем v8 требует 40MB на контекст.
Пол года спустя
Ни одной утечки памяти

Ни одного падения v8

Touch главная

Touch почта
Проблемы v8
http://sysoev.ru/prog/v8.html
Выступление Андрея Сумина, Mail.Ru Group, на High Performance Conference
Полезные ссылки
— http://code.google.com/p/v8/
— https://github.com/mailru/fest
— http://sysoev.ru/prog/v8.html

Андрей Сумин, andrewsumin@corp.mail.ru
Возможности
    fest
fest:value
<fest:value>json.name</fest:value>
try {
    html += escape(json.name);
} catch(e) {
    log(e.message);
}
fest:value
<fest:value output="text">json.name</fest:value>
try {
    html += json.name;
} catch(e) {
    log(e.message);
}
fest:value
<fest:value safe="true">json.name</fest:value>

html += json.name;
fest:if
<fest:if test="json.condition">…</fest:if>

try{ condition = json.condition } catch(e) { log(e) }

If (condition){ … }
fest:choose
<fest:choose>
   <fest:when test="json.condition">…</fest:when>
   <fest:when test="false">…</fest:when>
   <fest:otherwise>…</fest:otherwise>
</fest:choose>
fest:choose
try{ condition = json.condition } catch(e) { log(e) }
If (condition){…}
else{
    try{ condition = false } catch(e) { log(e) }
    if (condition){}
    else {} }
fest:foreach
<fest:foreach iterate="list" index="i"></fest:foreach>
var i;
try{ foreach = list } catch(e) { foreach=[]; log(e) }
var l = list.length;
for(i = 0; i < l ; i++) { … }
fest:for
<fest:for iterate="hash" index="i"></fest:for>
var i;
try{ for = hash } catch(e) { for={}; log(e) }
for(i in for) { … }
fest:space
<fest:space/>

html += " ";
fest:script
<fest:script> … </fest:script>

try{ … } catch (e) { log(e) }
fest:insert
<script>
   <fest:insert src="script.js"/>
</script>

html += "<script>…</script>";

More Related Content

PPTX
JavaScript на сервере, 1ms на трансформацию (Андрей Сумин)
PDF
Meet Magento Belarus 2015: Andrey Tataranovich
PDF
Андрей Татаранович (Amasty) - Секретные материалы техподдержки
PPTX
"ТОП10 SEO-ошибок при переезде сайта на https-протокол, смене домена" Вебинар...
PPTX
Алексей Морозов (Россия), Rambler.ru. ASP.NET в помощь хакеру и не только....
PPTX
Все о скорости сайтов. Мастер-класс на партнерской конференции 1С-Битрикс.
PPT
Drupal Perfomance issues, tips & tricks. Антон Иванов.
PDF
Скорость работы интернет магазина
JavaScript на сервере, 1ms на трансформацию (Андрей Сумин)
Meet Magento Belarus 2015: Andrey Tataranovich
Андрей Татаранович (Amasty) - Секретные материалы техподдержки
"ТОП10 SEO-ошибок при переезде сайта на https-протокол, смене домена" Вебинар...
Алексей Морозов (Россия), Rambler.ru. ASP.NET в помощь хакеру и не только....
Все о скорости сайтов. Мастер-класс на партнерской конференции 1С-Битрикс.
Drupal Perfomance issues, tips & tricks. Антон Иванов.
Скорость работы интернет магазина

What's hot (20)

PPT
Perl in practice
PPTX
"Великолепный API без Rest", Констатин Якушев (Badoo)
PDF
Паша Мурзаков: Как 200 строк на Go помогли нам освободить 15 серверов»
PPSX
Встроенная система профилирования в клиенте «Аллодов Онлайн»
PPTX
Татьяна Новикова (Казахстан), ЦАРКА. Как мы мониторим Казнет с помощью WebTotem
PPTX
KazHackStan 2017 | Tracking
PPT
Битва за миллисекунды: практика ускорения веб сайтов
PPT
Web sockets
PPT
Eugene Lisitsky Web Sockets
PPTX
Иван Чалыкин (Россия), Digital Security. Легальный SOP Bypass. Проблемы внедр...
PPT
Mafiozi Performance1
PPT
Drupal 6 performance
PDF
Доставка данных в реальном времени.
PDF
Андрей Абакумов (Россия). Yandex.ru. Соавтор: Эльдар Заитов. Автоматизация ск...
PPTX
50 оттенков кеширования: обзор актуальных батареек - Григорий Петров, VoxImplant
PDF
Алексей Андросов "HTML5 в Я.Почте"
PPT
PDF
Ян Жабин "Преимущества использования протокола HTTP/2"
PDF
HTTP протокол
PDF
Pavel Dovbush Toster
Perl in practice
"Великолепный API без Rest", Констатин Якушев (Badoo)
Паша Мурзаков: Как 200 строк на Go помогли нам освободить 15 серверов»
Встроенная система профилирования в клиенте «Аллодов Онлайн»
Татьяна Новикова (Казахстан), ЦАРКА. Как мы мониторим Казнет с помощью WebTotem
KazHackStan 2017 | Tracking
Битва за миллисекунды: практика ускорения веб сайтов
Web sockets
Eugene Lisitsky Web Sockets
Иван Чалыкин (Россия), Digital Security. Легальный SOP Bypass. Проблемы внедр...
Mafiozi Performance1
Drupal 6 performance
Доставка данных в реальном времени.
Андрей Абакумов (Россия). Yandex.ru. Соавтор: Эльдар Заитов. Автоматизация ск...
50 оттенков кеширования: обзор актуальных батареек - Григорий Петров, VoxImplant
Алексей Андросов "HTML5 в Я.Почте"
Ян Жабин "Преимущества использования протокола HTTP/2"
HTTP протокол
Pavel Dovbush Toster
Ad

Similar to Выступление Андрея Сумина, Mail.Ru Group, на High Performance Conference (20)

PDF
Парсим CSS: performance tips & tricks
PDF
Парсим CSS
PDF
Практическое применение HTML5 в Я.Почте
PDF
JavaScript Базовый. Занятие 09.
PDF
Фронтенд разработка без боли
PPT
Web весна 2012 лекция 9
PPT
Web осень 2012 лекция 9
PDF
Js templating stepan_reznikov
PDF
Степан Резников "Шаблонизация на клиенте"
PDF
CSSO – история ускорения
PDF
PDF
Павел Юрийчук - Разработка приложений под мобильные браузеры
PPT
Javascript
PDF
Михаил Корепанов "Инкрементальные обновления на клиенте. Ловкость рук и никак...
PPTX
Обзор Html 5
PDF
FrontTalks: Алексей Андросов (Яндекс), «Ошибки, которые мы любим»
PPTX
Мировые информационные ресурсы. Лекция 5
PPT
Эффективный AJAX
PPT
Подробная презентация JavaScript 6 в 1
PPT
Web весна 2013 лекция 9
Парсим CSS: performance tips & tricks
Парсим CSS
Практическое применение HTML5 в Я.Почте
JavaScript Базовый. Занятие 09.
Фронтенд разработка без боли
Web весна 2012 лекция 9
Web осень 2012 лекция 9
Js templating stepan_reznikov
Степан Резников "Шаблонизация на клиенте"
CSSO – история ускорения
Павел Юрийчук - Разработка приложений под мобильные браузеры
Javascript
Михаил Корепанов "Инкрементальные обновления на клиенте. Ловкость рук и никак...
Обзор Html 5
FrontTalks: Алексей Андросов (Яндекс), «Ошибки, которые мы любим»
Мировые информационные ресурсы. Лекция 5
Эффективный AJAX
Подробная презентация JavaScript 6 в 1
Web весна 2013 лекция 9
Ad

More from EYevseyeva (11)

PPTX
Программа развития менеджерских компетенций IT-руководителей QIWI
PPTX
Образовательный проект как способ подготовки молодых специалистов
PPTX
Чему и как учить IT специалистов?
PDF
Выступление Юрия Насретдинова, Badoo, на High Performance Conference
PDF
Выступление Сергея Аверина, Badoo, на High Performance Conference
PPTX
Артем Кумпель, Кому лучше работается?
PPTX
EMC2, Владимир Суворов
PPT
LiveLournal, Михаил Вавилов
PPT
Фотострана, Дмитрий Смирнов
PPT
Проект «Одноклассники» Mail.Ru Group, Андрей Паньгин
PPTX
ITmozg, Даниил Павлючков
Программа развития менеджерских компетенций IT-руководителей QIWI
Образовательный проект как способ подготовки молодых специалистов
Чему и как учить IT специалистов?
Выступление Юрия Насретдинова, Badoo, на High Performance Conference
Выступление Сергея Аверина, Badoo, на High Performance Conference
Артем Кумпель, Кому лучше работается?
EMC2, Владимир Суворов
LiveLournal, Михаил Вавилов
Фотострана, Дмитрий Смирнов
Проект «Одноклассники» Mail.Ru Group, Андрей Паньгин
ITmozg, Даниил Павлючков

Выступление Андрея Сумина, Mail.Ru Group, на High Performance Conference

Editor's Notes

  • #2: Зачем?
  • #3: — Пишут одни, а используют другие
  • #4: — Пишут одни, а используют другие — JavaScript специалисты
  • #5: — Пишут одни, а используют другие — JavaScript специалисты — Шаблонизация на клиенте
  • #6: Что нужно
  • #7: XSLT
  • #8: XSLT JS
  • #9: XSLT /head.xml &lt;title&gt;&lt; fest:get name=&quot; title &quot;/&gt;&lt;/title&gt; &lt; fest:set name=&quot; title &quot;&gt;Mail.ru&lt;/fest:set&gt;
  • #10: XSLT /head.xml &lt;title&gt;&lt; fest:get name=&quot; title &quot;/&gt;&lt;/title&gt; &lt; fest:set name=&quot; title &quot;&gt;Mail.ru&lt;/fest:set&gt; /mail.xml &lt;fest:include src=&quot; head.xml &quot;/&gt; &lt; fest:set name=&quot; title &quot;&gt;Почта&lt;/fest:set&gt;
  • #11: JavaScript &lt;fest:script&gt; var text = &quot; mail.ru &quot; &lt;/fest:script&gt; &lt;fest:value&gt; text &lt;/fest:value&gt;
  • #12: JavaScript &lt;fest:script&gt; var text = &quot; mail.ru &quot; &lt;/fest:script&gt; &lt;fest:value&gt; text &lt;/fest:value&gt; mail.ru
  • #13: XML
  • #14: — IDE
  • #15: — IDE — Валидация из коробки
  • #16: — IDE — Валидация из коробки — Name spaces
  • #17: — IDE — Валидация из коробки — Name spaces — SAX, XSLT, XSD, DTD …
  • #18: — IDE — Валидация из коробки — Name spaces — SAX, XSLT, XSD, DTD ... — XML to XML
  • #19: Реализация
  • #20: Картинка про ковбоев
  • #21: Структура vs Функция
  • #22: [ {action:&quot;template&quot;}, &quot;&lt;html&gt;...&quot;, {action:&quot;value&quot;}, &quot;json.value&quot;]
  • #23: [ {action:&quot;template&quot;}, &quot;&lt;html&gt;....”, {action:&quot; if &quot;}, &quot; json.value &quot;, &quot; &lt;span&gt;true&lt;/span&gt; &quot;, &quot; &lt;span&gt;false&lt;/span&gt; &quot;]
  • #24: function template(json){ var html = &quot;&quot;; html += &quot;&lt;html&gt;…&quot;; html += json.value; return html; }
  • #25: Картинка со списком писем
  • #26: 200 ms
  • #27: 3 ms
  • #28: fest:forearch for(i = 0; i &lt; l; i++) {} fest:if if(value) {} fest:choose if(value) {} else {} fest:set set[name] = function set[name] = function
  • #29: &lt;span&gt; html += &quot;&lt;span&gt;&quot;; mail.ru html += &quot;mail.ru&quot;; &lt;/span&gt; html += &quot;&lt;/span&gt;&quot;;
  • #30: &lt;span&gt; html += &quot;&lt;span&gt;&quot;; mail.ru html += &quot;mail.ru&quot;; &lt;/span&gt; html += &quot;&lt;/span&gt;&quot;; html += &quot;&lt;span&gt;mail.ru&lt;/span&gt;&quot;;
  • #31: 30%
  • #32: Безопасность
  • #33: try catch
  • #34: try catch escape
  • #35: &lt;fest:value&gt; json.name &lt;/fest:value&gt; try { html += escape( json.name ); } catch(e) { log(e.message) ; }
  • #36: Интеграция
  • #37: — С — Perl — Python — NodeJS
  • #38: — С fest_log — Perl fest_file — Python fest_dirname — NodeJS
  • #39: — С fest_log — Perl fest_file — Python fest_dirname — NodeJS — Браузер
  • #40: Реальные пользователи
  • #41: 4 ms
  • #42: msg_length = 5 msg_1_title = &quot;letter&quot; msg_1_Unread = 1
  • #43: msg_length = 5 msg_1_title = &quot;letter&quot; msg_1_Unread = 1 msg = [ {title: &quot;letter&quot;, Unread: true} ]
  • #44: hash -&gt; v8 api -&gt; JavaScript hash -&gt; string -&gt; JSON.parse -&gt; JavaScript hash -&gt; string -&gt; compile -&gt; Javascript
  • #45: Local&lt;String&gt; script = String::new( &quot;template(\\&quot;{value:&apos;mail.ru&apos;}\\&quot;)&quot; ); Local&lt;Script&gt; cs = Script::Compile( script ); Local&lt;Value&gt; result = cs-&gt;Run();
  • #46: 2 + 4 = 6ms
  • #47: 67 %
  • #48: NodeJS
  • #49: Картинка про 004 и 006
  • #50: msg_length = 5 msg_1_title = &quot;letter&quot; msg_1_Unread = 1
  • #51: msg_length = 5 msg_1_title = &quot;letter&quot; msg_1_Unread = 1 get(&apos;msg_&apos; + i + &apos;_title&apos;)
  • #52: Рисунок про 004 и 003
  • #53: 30 часов одно ядро 2.2 ГГц Xeon 10 000 000+ хитов 1.6ms среднее время трансформации 992 422 10% между 2 и 5ms 208 464 2% между 5 и 10ms 396 49 0,4% больше 10ms
  • #54: Продакшен, главная
  • #55: 50% x3
  • #56: 65+100=165кб
  • #57: RB lite v8 lite
  • #58: html += &quot;foo&quot;; html += rb(id); html += &quot;bar&quot;;
  • #59: html += &quot;foo&quot;; push_string(&quot;foo&quot;); html += rb(id); push_rb(id); html += &quot;bar&quot;; push_string(&quot;bar&quot;);
  • #60: 50% x2
  • #61: 440 000 000
  • #62: 440 000 000 110 000 000
  • #63: Графики с rss и la
  • #64: Данные на февраль 2012 года Размер HTML, который генерирует v8 65кб . Время, работы v8 на запрос 1ms . В среднем v8 требует 40MB на контекст.
  • #65: Пол года спустя Ни одной утечки памяти Ни одного падения v8 Touch главная Touch почта
  • #66: Проблемы v8
  • #67: http://sysoev.ru/prog/v8.html
  • #68: График утечек памяти
  • #69: — http://code.google.com/p/v8/ — https://github.com/mailru/fest — http://sysoev.ru/prog/v8.html Андрей Сумин, [email_address]