Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
React meets Nashorn #jjug_ccc #ccc_l8 /react-me...
Search
Manabu Matsuzaki
December 03, 2016
Technology
1
960
React meets Nashorn #jjug_ccc #ccc_l8 /react-meets-nashorn-jjug-ccc-2016-fall
JJUG CCC 2016 Fall で発表したスライドです
Manabu Matsuzaki
December 03, 2016
Tweet
Share
More Decks by Manabu Matsuzaki
See All by Manabu Matsuzaki
Spring BootユーザのためのArmeria入門 #jsug / Introduce to Armeria for Spring users
matsumana
0
2.9k
Canary Release with Argo Rollouts #ふくばねてす / canary-release-with-argo-rollouts
matsumana
1
1.2k
Getting started Central Dogma with Golang #fukuokago #umedago / getting-started-central-dogma-with-golang
matsumana
0
910
Micrometer入門 #javaq / introduce-to-micrometer
matsumana
1
3k
ArmeriaとCentral Dogmaから学ぶ、マイクロサービスに必要な機能 #edayfuk / lean-from-armeria-and-central-dogma
matsumana
0
4.4k
SREcon19 Americas 参加レポート #srefukuoka / srecon19-americas-report
matsumana
0
900
SRE入門 & チームで取り組んでいるSRE #srefukuoka / introduce-to-sre
matsumana
0
1.3k
Introduce to Armeria and Central Dogma #GWD_Nulab / introduce-to-armeria-and-central-dogma
matsumana
0
570
Connector/JでMaster/Slave Replication構成のMySQLに接続する #mysql_casual_fukuoka /connector-j-master-slave-replication
matsumana
0
1.5k
Other Decks in Technology
See All in Technology
LangChain v1.0にトライ~ AIエージェントアプリの移行(v0.3 → v1.0) ~
happysamurai294
0
160
MySQL AIとMySQL Studioを使ってみよう
ikomachi226
0
130
インフラ屋さんはAIコーディングエージェントとどう生きるか/How infrastructure engineers interact with Kiro
ozawa
2
110
AI/MLのマルチテナント基盤を支えるコンテナ技術
pfn
PRO
4
630
私のRails開発環境
yahonda
0
170
Digitization部 紹介資料
sansan33
PRO
1
6.1k
Oracle Database@Google Cloud:サービス概要のご紹介
oracle4engineer
PRO
0
620
「え?!それ今ではHTMLだけでできるの!?」驚きの進化を遂げたモダンHTML
riyaamemiya
9
3.9k
ページの可視領域を算出する方法について整理する
yamatai1212
0
150
MS Ignite 2025で発表されたFoundry IQをRecap
satodayo
3
220
Eight Engineering Unit 紹介資料
sansan33
PRO
0
5.7k
Symfony AI in Action
el_stoffel
2
340
Featured
See All Featured
Typedesign – Prime Four
hannesfritz
42
2.9k
Building Adaptive Systems
keathley
44
2.9k
The Art of Programming - Codeland 2020
erikaheidi
56
14k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
15k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.3k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.8k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
Making Projects Easy
brettharned
120
6.5k
Into the Great Unknown - MozCon
thekraken
40
2.2k
Building Flexible Design Systems
yeseniaperezcruz
329
39k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
140
34k
Building Better People: How to give real-time feedback that sticks.
wjessup
370
20k
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 • αϯϓϧιʔε