Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

es6-in-production

Avatar for pramendra pramendra
September 22, 2017
Technology
110
0

 es6-in-production

Avatar for pramendra

pramendra

September 22, 2017

More Decks by pramendra

See All by pramendra
Why not React Native - JP
Avatar for pramendra pramendra
3
1.2k
Why not React Native - EN
Avatar for pramendra pramendra
0
330
Consulting in 2020
Avatar for pramendra pramendra
0
110

Other Decks in Technology

See All in Technology
MCPゲートウェイを作って運用してわかったこと — Agent時代の権限管理の現在地
Avatar for k.muguruma mtpooh
10
3.2k
2026-10-01_MagicPod_QAハーネスエンジニアリングとQA組織の未来像
Avatar for 西田泰明 ynisqa1988
1
550
BedrockとLambdaで作る リアルタイム進行型推理ゲーム
Avatar for kawai kawametho
0
190
自主式軟體工廠
Avatar for philipz philipz
0
230
無理せず続ける、子育てエンジニアの学び
Avatar for コドモン開発チーム codmoninc
PRO
0
230
AI時代に必要な脅威モデリング― 変化の速度に負けない理解とリスク判断
Avatar for masakane55 masakane55
4
1.1k
[AWS 秋のクラウドオペレーション祭り 2026]AWS DevOps Agentで変わる リリースと運用対応 ~リリース管理機能と Directed actions のご紹介~
Avatar for Toshihiro Furuno furuton
4
1k
FactoryBotアンチパターン / factory_bot anti-patterns
Avatar for toshimaru toshimaru
0
140
しろおびから始める！ログ活用の第一歩
Avatar for Shumei Ito shumei_ito
0
140
The seven pitfalls of AI (revised version)
Avatar for Uwe Friedrichsen ufried
0
280
Futexes the good, the bad, the ugly
Avatar for Kernel Recipes ennael
PRO
0
130
Datadog の学び方 - あるいは、オブザーバビリティを学ぶとは何か
Avatar for iwa mananyuki
1
490

Featured

See All Featured
Done Done
Avatar for chrislema chrislema
187
17k
How Software Deployment tools have changed in the past 20 years
Avatar for Geshan Manandhar geshan
2
35k
We Analyzed 250 Million AI Search Results: Here's What I Found
Avatar for Josh Blyskal joshbly
2
2k
The Spectacular Lies of Maps
Avatar for Per Axbom axbom
PRO
1
1.1k
The Pragmatic Product Professional
Avatar for Laura Van Doore lauravandoore
37
7.5k
Sharpening the Axe: The Primacy of Toolmaking
Avatar for Bryan Cantrill bcantrill
46
3k
SERP Conf. Vienna - Web Accessibility: Optimizing for Inclusivity and SEO
Avatar for Sara Fernández Carmona sarafernandez
2
1.6k
The Mindset for Success: Future Career Progression
Avatar for Greg Gifford greggifford
PRO
0
530
Darren the Foodie - Storyboard
Avatar for Kevinho.art khoart
PRO
4
4k
How to audit for AI Accessibility on your Front & Back End
Avatar for davetheseo davetheseo
0
570
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
29
4.5k
Java REST API Framework Comparison - PWX 2021
Avatar for Matt Raible mraible
34
9.7k

Transcript

  1. ES6 in Production Pramendra Gupta

  2. ES6(ES2015)

  3. const test = ({id, user}) => <h1><span>{id}</span>{user}</ h1>; ES6(ES2015)

  4. const test = ({id, user}) => <h1><span>{id}</span>{user}</h1>; "use strict"; var

    test = function test(_ref) { var id = _ref.id, user = _ref.user; return React.createElement( "h1", null, React.createElement( "span", null, id ), user ); }; ES6 ES5

  5. We ship fallback to support legacy browser

  6. Browser Support

  7. Disadvantage of ES5 File Size Parse Time big large Debug

    hard
  8. None

  9. <script type="module" />

  10. None

  11. async/await Classes Arrow functions Promises Map Set ES6 modules support

    lands in browsers <script type="module" />

  12. Advantage of ES6 version size(min+gzipped) parse time ES5 40k 360ms

    ES6+ 20k 170ms File Size Parse Time small low Debug easy

  13. ES6 Rocks

  14. How do we use <!DOCTYPE html> <html> <head> <title>ES6 in

    Production</title> <script type="module" src="bundle.js"></script> </head> <body> <div id="app"></div> <script nomodule src="bundle-legacy.js"></script> </body> </html>

  15. Demo https://github.com/pramendra/es6-in-production