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
React meets Nashorn #jjug_ccc #ccc_l8 /react-me...
Search
Manabu Matsuzaki
December 03, 2016
Technology
1k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
React meets Nashorn #jjug_ccc #ccc_l8 /react-meets-nashorn-jjug-ccc-2016-fall
JJUG CCC 2016 Fall で発表したスライドです
Manabu Matsuzaki
December 03, 2016
More Decks by Manabu Matsuzaki
See All by Manabu Matsuzaki
Spring BootユーザのためのArmeria入門 #jsug / Introduce to Armeria for Spring users
matsumana
0
3k
Canary Release with Argo Rollouts #ふくばねてす / canary-release-with-argo-rollouts
matsumana
1
1.3k
Getting started Central Dogma with Golang #fukuokago #umedago / getting-started-central-dogma-with-golang
matsumana
0
1k
Micrometer入門 #javaq / introduce-to-micrometer
matsumana
1
3.1k
ArmeriaとCentral Dogmaから学ぶ、マイクロサービスに必要な機能 #edayfuk / lean-from-armeria-and-central-dogma
matsumana
0
4.7k
SREcon19 Americas 参加レポート #srefukuoka / srecon19-americas-report
matsumana
0
960
SRE入門 & チームで取り組んでいるSRE #srefukuoka / introduce-to-sre
matsumana
0
1.4k
Introduce to Armeria and Central Dogma #GWD_Nulab / introduce-to-armeria-and-central-dogma
matsumana
0
630
Connector/JでMaster/Slave Replication構成のMySQLに接続する #mysql_casual_fukuoka /connector-j-master-slave-replication
matsumana
0
1.6k
Other Decks in Technology
See All in Technology
TSKaigi Sendai 2026 - tsgo時代のTypeScript Playgroundはどう動くか
teamlab
PRO
0
110
顧客合意を取りながら進めるAWSコスト削減の実践
optim
0
150
Kiro Crew 入門 (手を離しても進む仕事) | 目指せ Kiro マスター 11
inariku
PRO
4
650
IBC 2026 動画技術関連レポート / IBC 2026 Report
cyberagentdevelopers
PRO
2
450
サボる子はいねぇがー!AgentCoreハーネスの脆弱性に学ぶ、エージェントの入力バリデーション
iwamot
PRO
5
320
Context Ontology Accelerator 入門 (業務データの意味を、AI エージェントに渡す)
inariku
PRO
3
600
eBPF 簡介 2026 版
shunghsiyu
0
190
レガシーコードに対する loop engineering的なAI開発プロセス導入について
kubell_hr
0
300
DBTS2026 盛り上がってますか!?Databricksが実現するAI時代のデータ基盤
akuwano
1
200
AX時代の自治体支援リソース再配分と役割分担の再構成:戦略とロードマップ(概要)
sishi2026
0
210
プロダクションコードにおける encoding/json から encoding/json/v2 へのスムーズな移行
sansantech
PRO
1
230
Kiro IDE 入門 (画面の各部から、頼み方、任せ方、戻し方まで) | 目指せ Kiro マスター 02
inariku
PRO
4
170
Featured
See All Featured
Winning Ecommerce Organic Search in an AI Era - #searchnstuff2025
aleyda
2
2.2k
Exploring the relationship between traditional SERPs and Gen AI search
raygrieselhuber
PRO
4
4.4k
Building Better People: How to give real-time feedback that sticks.
wjessup
371
20k
Discover your Explorer Soul
emna__ayadi
2
1.3k
Faster Mobile Websites
deanohume
310
32k
The #1 spot is gone: here's how to win anyway
tamaranovitovic
4
1.2k
WENDY [Excerpt]
tessaabrams
14
40k
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
6
1.3k
Git: the NoSQL Database
bkeepers
PRO
433
67k
Ten Tips & Tricks for a 🌱 transition
stuffmc
1
280
WCS-LA-2024
lcolladotor
0
990
How GitHub (no longer) Works
holman
316
150k
Transcript
React meets Nashorn JJUG CCC 2016 Fall 2016/12/03 @matsumana
ࣗݾհ • ໊લɿ দ࡚ ֶ • ॴଐɿ LINE Fukuokaגࣜձࣾ ։ൃࢧԉνʔϜ
• Twitterɿ @matsumana
ΞδΣϯμ • NashornͱReactͷ؆୯ͳհ • αʔόαΠυϨϯμϦϯάͷϝϦοτ • NashornͰReactΛಈ͔͢ʹ • NashornͰReactΛαʔόαΠυϨϯμϦ ϯάͯ͠ૺ۰ͨ͠
“αʔόαΠυϨϯμϦϯά” ͍ͷͰ Ҏ߱”SSR”ͱදه͠·͢
Nashornʹ͍ͭͯ
• Java8ʹಉࠝ͞Ε͍ͯΔJavaScriptΤϯδϯ (Java7·ͰRhinoͩͬͨ) • Java8ͷNashornͰ ECMA-262 Edition 5.1 ४ڌ •
Java9ͰES6ରԠ
https://blogs.oracle.com/wlc/entry/javaee_c117 ΑΓൈਮ • JavaScriptΛɺ͍ͬͨΜAST/IRʢநߏจ ʗதؒදݱʣͱ͍͏தؒੜʹม͠ɺͦ ͔͜ΒASMΛͬͯJavaόΠτίʔυΛੜ ͢Δ (JavaScript͕JavaόΠτίʔυʹͳΔ) • ͕ͨͬͯ͠ɺJavaScript͕ωΠςΟϒʹJVM্
Ͱಈ࡞͢ΔɻύϑΥʔϚϯεʹࢧো͕ͳ͍
JDK™ 9 Early Access Releases ͷNashornͰES6Λ ࢼ͢ࣄ͕ग़དྷ·͢ • JDK™ 9
Early Access Releases https://jdk9.java.net/download/ • JEP 292 http://openjdk.java.net/jeps/292
$ jjs -h jjs [<options>] <files> [-- <arguments>] … ུ
… --language (Specify ECMAScript language version.) param: [es5|es6] default: es5 … ུ … JDK™ 9 Early Access Releases Build 146Ͱࢼͯ͠ΈΔ
$ jjs --language=es6 jjs> let hello = (name) => 'Hello,
' + name; jjs> hello('World!'); Hello, World!
jjs> class Greet { ...> constructor(v) { ...> this.v =
v; ...> } ...> hello() { ...> return this.v; ...> } ...> } java.lang.RuntimeException: <shell>:1:0 ES6 class declarations and expressions are not yet implemented class Greet { ^
·ͩES6ͷશߏจ ͑ͳ͍
ࠓޙͷES6ରԠʹ͍ͭͯ • JavaOne 2016ͰʮWhat’s New in JDK 9?ʯ ͱ͍͏ηογϣϯ͕͋Γ·ͨ͠ ެ։͞ΕͨεϥΠυʹΑΔͱɺ
"Follow ups in minor releases"ͱͷࣄ https://oracle.rainfocus.com/scripts/ catalog/oow16.jsp? event=javaone&search=nashorn&showEnr olled=false&search.event=javaone
Reactʹ͍ͭͯ
ެࣜνϡʔτϦΞϧΑΓൈਮ React is a declarative, efficient, and flexible JavaScript library
for building user interfaces. (ReactϢʔβʔΠϯλʔϑΣΠεΛߏங͢ ΔͨΊͷએݴతͰޮతͰॊೈͳJavaScript ϥΠϒϥϦͰ͢)
ެࣜνϡʔτϦΞϧΑΓൈਮ
SSRͷϝϦοτ
• ॳճͷϖʔδද͕͍ࣔɺ ද͕ࣔνϥͭ͘ͱ͍͏͕ղܾͰ͖Δ • αʔόʔαΠυͱϑϩϯτΤϯυͰ ಉ͡ίʔυΛڞ༗Ͱ͖Δ (Universal JavaScript) ※ҎલIsomorphic JavaScriptͱݺΕ͍ͯͨ
NashornͰReactΛ ಈ͔͢ʹ
• Springͩͱ؆୯ʹग़དྷΔ Spring Framework 4.2ͰScript Templating ͱ͍͏ػೳ͕Ճ͞Ε͍ͯΔ https://spring.io/blog/2016/03/15/ springone2gx-2015-replay-isomorphic- templating-with-spring-boot-nashorn-and-
react
• ϒϥβͷJavaScriptڥʹଘࡏ͢Δ͕ Nashornʹଘࡏ͠ͳ͍ͷ͕͋ΔͷͰ ػೳͷ݀ΛຒΊΔඞཁ͕͋Δ(polyfill) • windowΦϒδΣΫτͳͲ
• Java8ͷNashornES5͔͠αϙʔτͯ͠ ͳ͍ͷͰES5Ͱॻ͔͘ ES6Ͱॻ͍ͯBabelͰτϥϯεύΠϧ͢Δ
• Java࠷৽όʔδϣϯΛ͏ • Java 8u66ͰҎԼͷ͕fix͞Ε͍ͯΔ • Nashorn react.js benchmark performance
regression http://www.oracle.com/technetwork/java/ javase/2col/8u66-bugfixes-2692105.html http://bugs.java.com/view_bug.do? bug_id=8134403
ૺ۰ͨ͠
ૺ۰ͨ͠ • NashornͷॳظԽॲཧ͕͍ ͳ͍ͥͷ͔ʁ
1. ReactεϨουηʔϑͰͳ͍ͷͰɺ NashornͷΠϯελϯεΛ ThreadLocalʹอ࣋͢Δඞཁ͕͋Δ (Spring͕ThreadLocalʹอ͍࣋ͯ͠Δ) ૺ۰ͨ͠
2. JavaScriptιʔε͔ΒASTΛੜͯ͠ JavaόΠτίʔυੜͱ͍͏ॲཧ͕ APαʔόͷεϨουຖʹߦΘΕΔ ૺ۰ͨ͠
3. Nashorn͕ॳظԽ͞Εͯͳ͍εϨουͰ HTTPϦΫΤετ͕ॲཧ͞ΕΔʹ ॳظԽॲཧ͕ߦΘΕΔ ૺ۰ͨ͠
ૺ۰ͨ͠ • ϫʔΫΞϥϯυ • ։ൃ࣌APαʔόͷεϨουΛݮΒ͢ • ຊ൪ͰΞϓϦىಈޙͷΥʔϜΞοϓ ॲཧΛݕ౼͢Δ
ͦͷଞ ؾΛ͚ͭΔࣄ • componentWillMountʹϑϩϯτΤϯυͰ͠ ͔ಈ࡞͠ͳ͍ίʔυΛॻ͍͍͚ͯͳ͍ componentWillMountSSRͰݺΕΔ͕ componentDidMountݺΕͳ͍ͱ͍͏ࣄ Λҙࣝͯ͠ίʔυΛॻ͘ඞཁ͕͋Δ
·ͱΊ • NashornͷॳظԽॲཧ͕͍ (ϫʔΫΞϥϯυ͋Δ) • αʔόαΠυͱϑϩϯτΤϯυͷ྆ํͰ ಈ͘ReactΞϓϦΛॻ͘ͷ͍͠ • SSR͕ඞཁ͔Α͘ݕ౼ͨ͠ํ͕ྑ͍
ϦϯΫू • Java SE 8ͷ৽JavaScriptΤϯδϯʮNashornʯ͕࣮ݱ͢Δ࣍ੈͷ “JavaScript in Java”ڥ • JEP
292 • What’s New in JDK 9? • Tutorial: Intro To React • SpringOne2GX 2015 replay: Isomorphic templating with Spring Boot, Nashorn and React • JDK 8u66 Bug Fixes • JDK-8134403 : Nashorn react.js benchmark performance regression • αϯϓϧιʔε