Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
es6-in-production
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
pramendra
September 22, 2017
Technology
110
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
es6-in-production
pramendra
September 22, 2017
Transcript
15 slides
ES6 in Production Pramendra Gupta
ES6(ES2015)
const test = ({id, user}) => <h1><span>{id}</span>{user}</ h1>; ES6(ES2015)
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
We ship fallback to support legacy browser
Browser Support
Disadvantage of ES5 File Size Parse Time big large Debug
hard
None
<script type="module" />
None
async/await Classes Arrow functions Promises Map Set ES6 modules support
lands in browsers <script type="module" />
Advantage of ES6 version size(min+gzipped) parse time ES5 40k 360ms
ES6+ 20k 170ms File Size Parse Time small low Debug easy
ES6 Rocks
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>
Demo https://github.com/pramendra/es6-in-production
More Decks by pramendra
See All by pramendra
Why not React Native - JP
pramendra
3
1.2k
Why not React Native - EN
pramendra
0
340
Consulting in 2020
pramendra
0
110
Other Decks in Technology
See All in Technology
JAWSコミュニティに 参加して1年経った結果
ssakita
0
150
内製アプリとClaudeスキルのセキュリティチェック、 Backlogの課題で回しています。
ayaka_egaaa
0
190
Steering と Hook (チームの決まりを守らせる) | 目指せ Kiro マスター 06
inariku
PRO
2
130
Kiro 入門 (1 つのエージェントを、どの画面からでも) | 目指せ Kiro マスター 01
inariku
PRO
6
1.8k
_マネジメントする人される人ナイト_2026__良いチームを作っていきたい_お気持ち_.pdf
xkxaxkx
0
430
顧客合意を取りながら進めるAWSコスト削減の実践
optim
0
170
AIネイティブ組織の作り方。1人のPOとAIから始める、自社での実験
ama_ch
1
560
サボる子はいねぇがー!AgentCoreハーネスの脆弱性に学ぶ、エージェントの入力バリデーション
iwamot
PRO
5
340
[JAWS Festa 2026]一番いい仕事は、請求書に現れない / jawsfesta2026
sh_fk2
2
530
2026-11-11 Tamachi.sre#7 PaCにインフラリソースの命を救われました。 / PaC saves the infra resource life
masasuzu
1
170
MCPでネットワーク障害調査を自動化する前に直すべき3つのこと
yama3133
0
220
変更差分を読むために環境を整備しよう
pipepasta
1
280
Featured
See All Featured
BBQ
matthewcrist
90
10k
Bootstrapping a Software Product
garrettdimon
PRO
306
120k
Conquering PDFs: document understanding beyond plain text
inesmontani
PRO
4
3.3k
A brief & incomplete history of UX Design for the World Wide Web: 1989–2019
jct
2
560
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
287
14k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
33
5.7k
Getting science done with accelerated Python computing platforms
jacobtomlinson
2
570
SEO for Brand Visibility & Recognition
aleyda
0
4.9k
Highjacked: Video Game Concept Design
rkendrick25
PRO
2
570
The World Runs on Bad Software
bkeepers
PRO
72
12k
Sam Torres - BigQuery for SEOs
techseoconnect
PRO
0
610
What's in a price? How to price your products and services
michaelherold
247
13k