13 521
правка
Изменения
м
→Destructuring @@
; subfooter: <span style="font-family: Consolas; background: #f1dd56; padding: 5px; font-style: normal; color: black">ECMAScript и все-все-все</span>
</slideshow>
; PDF-версия: [[Media:ES6 and everyone.pdf|ES6 and everyone.pdf]]
== ECMAScript — ассемблер будущего,<br /> бэкенд, фронтенд и все-все-все @@ %% ==
На ЛОРе до сих пор шутят, что «Java тормозит», а что ж тогда JS?
* А ничего — и Java быстрая, и он быстрый. {{gray|Мамонты видать шутят}}
*: {{mag|из скриптоты node.js быстрее всех}}
* Но он же интерпретируемый?
*: НЕТ! '''Интерпретируемых''' языков уже вообще нет.
=== Вычислительный [https://blog.famzah.net/2016/02/09/cpp-vs-python-vs-perl-vs-php-performance-benchmark-2016/ бенчмарк] @@ ===
* https://github.com/famzah/langs-performance, время на 10 итераций (i386)* C++ (g++ 5.3.1) -O2 = 1.124s {{gray|1=(у меня g++ 6.1.1 ) -O2 = {{green|0.95s}})92s}}* java8 {{gray|''[ручные массивы]''}} = 1.428s {{gray|(у меня {{green|0.92s}}; java6 = {{green|1s}}{{gray|''(ручные массивы)''}}* PyPy (tracing jit) = 1.72s 25s* Rust 1.12 = {{graygreen|(у меня 10.25s)85s}}! Go 1.7 = 1.14s* '''node.js = 2s''' {{gray|1=(у меня 4.6 = '''1.36s35s''' + [https://blog.famzah.net/2016/09/10/cpp-vs-python-vs-php-vs-java-vs-others-performance-benchmark-2016-q3/#comment-21850 баг], ; nodejs 0.10 = 2.60s)}}6s* PHP 7 = 6.7s {{gray|(у меня 9.7s)}}* Ruby 2.3 = 14.3s, Python 3.5 = 19s17s, 2.7 = 21s {{gray|(у меня 18.6s / 20.6s)}}20s* Perl = 25s {{gray|(у меня 25.6s)}}24s* '''PHP 5.6 = 69s42.5s''' :))))) {{gray|(у меня 43.6s)}} {{mag|ахаха, прекрати}}
==== Разница между 64 и 32 бит: amd64 i386 @@ ====
<plot>
set yrange [0:13]
set xrange [0:55]
set ytics ('Rust 1.1211' 1, 'C++' 2, 'Java 8' 3, 'PyPy' 4, 'Go' 5, 'node.js' 6, 'PHP 7' 7, 'Ruby 2.3' 8, 'Python 3.5' 9, 'Python 2.7' 10, 'Perl' 11, 'PHP 5.6' 12)
set grid xtics
set mxtics 1
set style fill solid 1.0 noborder
set boxwidth 0.7 relative
plot 'lang.dat' using 2:1:(0.0):2:(($1)-(binwidth/2.0)):(($1)+(binwidth/2.0)) with boxxyerrorbars title 'x = Быстрее PHP 5.6 в x раз'
DATASET lang
1.0 5049.9592.0 4746.88083.0 4346.53384.0 2934.54985.0 2837.65366.0 2731.18777.0 86.5338.0 42.62989.0 32.184910.0 2.591211.0 21.2276
12.0 1.00
ENDDATASET
</plot>
==== Разница между 64 и 32 бит: i386 amd64 @@ ====
<plot>
set yrange [0:13]
set xrange [0:55]
set ytics ('Rust 1.1112' 1, 'C++' 2, 'Java 8' 3, 'PyPy' 4, 'Go' 5, 'node.js' 6, 'PHP 7' 7, 'Ruby 2.3' 8, 'Python 3.5' 9, 'Python 2.7' 10, 'Perl' 11, 'PHP 5.6' 12)
set grid xtics
set mxtics 1
set style fill solid 1.0 noborder
set boxwidth 0.7 relative
plot 'lang.dat' using 2:1:(0.0):2:(($1)-(binwidth/2.0)):(($1)+(binwidth/2.0)) with boxxyerrorbars title 'x = Быстрее PHP 5.6 в x раз'
DATASET lang
1.0 4950.9952.0 4647.08883.0 4643.38534.0 3429.98545.0 3728.36656.0 3127.77187.0 68.3538.0 24.98629.0 23.491810.0 2.125911.0 12.7622
12.0 1.00
ENDDATASET
[[File:asmjs-bench.png|600px]]
=== Производительность — Производительность — итого @@ ===
* Итого, V8 — V8 — «смешанный» JIT* В Firefox — Firefox — [https://developer.mozilla.org/en-US/docs/Mozilla/Projects/SpiderMonkey/Internals/Tracing_JIT тоже всё шустро]
* Чакра Наделлы тоже очень похожа на V8
* Постоянная битва :) https://arewefastyet.com/
* всё остальное — '''object'''
** хеш — объект дефолтного типа: <tt><nowiki>{ key: "value" }</nowiki></tt>
** массив — разновидность объекта (класс Array): <ttstyle="white-space: nowrap"><nowiki>[ "value1", 2, 3, "value3" ]</nowiki></tt>
** функции — тоже объекты, их typeof = '''function'''
* regexp literals: <tt><nowiki>var re = /<html[^<>]*>/i;</nowiki></tt>
* break label, continue label
* Цикл по {{blue|ключам}}: <tt><nowiki>for (var i </nowiki>{{blue|in }}<nowiki> obj) {}</nowiki></tt>* Цикл по {{green|значениям (ES6)}}: <tt><nowiki>for (var i </nowiki>{{bluegreen|of}}<nowiki> obj) {}</nowiki></tt>
<source lang="javascript">
<source lang="javascript">
var obj = { key: 'abc', value: [ 1, 2 ] };
var { key: k, value: [ a, b ], other: o = 3 } = obj; // 3 - значение по умолчанию
// можно в параметрах функции!
* requirejs — система загрузки и сборки AMD модулей
* [http://jshint.com/ jshint] — проверка на ошибки и стиль
* yui-compressor, closure compiler — compiler — обфускаторы* [http://rollupjs.org/ rollup] — — система сборки для ES6 модулей (используется реже)
=== IDE, редакторы, отладка @@ ===
* React: {{blue|ПРОСТО ИСПОЛЬЗУЙТЕ JS :)}} (обычный for или Array.map())
<blockquote>Angular 2 continues to put “JS” «JS» into HTML. React puts “HTML” «HTML» into JS.</blockquote>
==== JSX @@ ====
* componentWillUpdate(p, s), componentDidUpdate(p, s)
* propTypes, mixins, statics
==== А вот почему это красиво @@ ====
ExtJS. Класс «панель». {{red|Где тут делать инициализацию?}}
[[File:Extjs-events.png|400px]]
{{red|beforerender? render? afterrender? afterlayout? added? add? show?}} {{gray|спойлер: нигде}}
==== Библиотеки для React @@ ====