Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
これからのメタプログラミングJavaScriptの正義を語ろう / meta programm...
Search
erukiti
November 18, 2017
Programming
5
2.4k
これからのメタプログラミングJavaScriptの正義を語ろう / meta programming JavaScript is Justice
コーディングタイムコンパイル
暖かき溢れる手作業による重複を根絶する
生産性を向上して、相対賃金を上げる
erukiti
November 18, 2017
Tweet
Share
More Decks by erukiti
See All by erukiti
LLMをねじ伏せる/Conquer the LLM
erukiti
0
96
鮮度が高すぎて世界で誰も正解を見つけてない課題に取り組んでいる/ Freshness issues
erukiti
1
710
実演TypeScript + GitHub Copilot
erukiti
9
4.2k
Function Calling対応Playgroundを作って検証してみた/LLMMeetup#3
erukiti
0
460
プロンプトを管理しやすくするツールを作ってみた / I created a tool to make the prompts easier to manage.
erukiti
3
1.9k
実践モブプログラミング/ mob programming practice
erukiti
3
1.5k
今日からアウトプットを始めよう / let's start the output from today
erukiti
1
740
Markdownをスクリプト言語として走らせてみた / actual-code
erukiti
0
4.2k
もくもく執筆会 for 技術書典5 / techbook_meepup
erukiti
0
180
Other Decks in Programming
See All in Programming
Rails アプリ地図考 Flush Cut
makicamel
1
110
SRE、開発、QAが協業して挑んだリリースプロセス改革@SRE Kaigi 2025
nealle
3
4.1k
CNCF Project の作者が考えている OSS の運営
utam0k
5
690
密集、ドキュメントのコロケーション with AWS Lambda
satoshi256kbyte
0
170
富山発の個人開発サービスで日本中の学校の業務を改善した話
krpk1900
4
370
Immutable ActiveRecord
megane42
0
130
SpringBoot3.4の構造化ログ #kanjava
irof
2
970
Domain-Driven Transformation
hschwentner
2
1.9k
データの整合性を保つ非同期処理アーキテクチャパターン / Async Architecture Patterns
mokuo
41
15k
XStateを用いた堅牢なReact Components設計~複雑なClient Stateをシンプルに~ @React Tokyo ミートアップ #2
kfurusho
1
770
定理証明プラットフォーム lapisla.net
abap34
1
1.7k
SwiftUI Viewの責務分離
elmetal
PRO
0
140
Featured
See All Featured
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
4
400
Embracing the Ebb and Flow
colly
84
4.6k
Designing on Purpose - Digital PM Summit 2013
jponch
117
7.1k
Reflections from 52 weeks, 52 projects
jeffersonlam
348
20k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
3
310
The Art of Programming - Codeland 2020
erikaheidi
53
13k
It's Worth the Effort
3n
184
28k
Code Review Best Practice
trishagee
66
17k
[RailsConf 2023] Rails as a piece of cake
palkan
53
5.2k
Large-scale JavaScript Application Architecture
addyosmani
510
110k
A Modern Web Designer's Workflow
chriscoyier
693
190k
GraphQLとの向き合い方2022年版
quramy
44
13k
Transcript
͜Ε͔Βͷ ϝλϓϩάϥϛϯά JavaScriptͷਖ਼ٛΛޠΖ͏ @erukiti ϝλϓϩάϥϚ(AST෩)
@erukiti • కΊΓۦಈͰٕज़ॻΛࣥච • ۭɾໝυϦϒϯΤϯδχΞ • ϑϩϯτΤϯυ͋·Γͬͨ͜ͱͳ͍όοΫΤϯυ ͷܦྺ͔Γͳແ৬ (࣌ʑϑϦʔͰࣄͯ͠Δ) •
࠷ۙɺASTΛ׆༻ͨ͠property based testingͷ࡞ ΄͔ɺͻͨ͢ΒAST৮ͬͯΔ
ʮͰ͖ΔΤϯδχΞ ੜ࢈ੑ͕Ұܻɾೋܻҧ͏ʯ
ੈքअѱʹຬ͍ͪͯΔ
ߦ͑ؔ OJDFDBUDI ແࢹ͞ΕΔXBSOJOH ॥తෳࡶ͑ *%&͕ແ͍ͱίʔυͷѲ͕Ͱ͖ͳ͍ ফͨ͠Βಈ͔ͳ͘ͳΓ·͢ ໊લۭؒԚછ ಉ͡ϩδοΫ͕ෳՕॴʹ
ʮࣈͬΆ͍จࣈྻͳͷͰࣈʹม͓͖ͯ͠·ͨ͠ʯ Ϣχοτςετ͕શ͘ແ͍ ͓·͡ͳ͍ ίϐϖϓϩάϥϛϯά ҉ͷܕม Ͳ͜Λॻ͖͑Ε͍͍ͷ͔Θ͔Βͳ͍ ҰՕॴॻ͖͑ͨΒଞʹӨڹͰ·ͬͨ͘ DPOTPMFMPH IPHF ফ͢ͱԿނ͔ಈ͔ͳ͍ ಉ͡ϩδοΫ͕ෳՕॴʹ
ϘʔϧυϚʔΧʔ
ਓ͕ؒཧղͰ͖Δఔʹ γϯϓϧʹ͍ͨ͠
ରࡦํ๏ • ΫϥεϝιουͷΛݮΒ͢ (جຊ୯Ұ ͷݪଇ) • ૄ݁߹ʹ͢Δ • ׂ౷࣏͢Δ •
DRYݪଇΛकΔ
DRY - Don’t Repeat Yourself • ʮ͋ͳͨͷखͰ܁Γฦ͍͚ͯ͠ͳ͍ʯ • ͭ·Γʮ͋ͳͨͷखʯ͡Όͳ͔ͬͨΒ܁Γฦ ͍͍ͯ͠
• ܁Γฦ͕͠ಘҙͰɺͱͯਖ਼֬ͳϠπʹΒͤ Α͏
ͦ͜Ͱϝλϓϩάϥϛϯά
ϝλϓϩάϥϛϯά • ιʔείʔυͰιʔείʔυΛੜ͢Δ • ੜݩ͕DRYͰ͑͋͞Ε͍͍ • ੩తͳϝλϓϩͱಈతͳϝλϓϩ͕͋Δ
None
Babel • JSքͰҰ൪ΘΕͯΔɺϝλϓϩάϥϛϯά ʹΑΔϓϩμΫτ • ϓϥάΠϯͦͷू߹ମͰ͋ΔϓϦηοτΛ ͬͯιʔείʔυΛม͢Δ • ϓϥάΠϯ࡞ΔͷɺπʔϧνΣΠϯͷαϙʔ τ͕͋ΔͷͰ͔ͳΓ؆୯
BabelπʔϧνΣΠϯ • ࣈ۟ղੳͱ͔໘͝ͱશͯҾ͖ड͚ͯ͘Ε Δ • ؔఆٛɺมఆٛɺೋ߲ԋࢉͳͲɺಛఆͷ ෦Λநग़Ͱ͖Δ • ੩తղੳʹΑΔมͷείʔϓղੳɺ͋Δఔ ͷࣗಈ࠷దԽ
• 100ߦҎͰͬ͘͞ΓDIΛ࡞ΕΔ • 100ߦҎͰͬ͘͞Γ࠷దԽϓϥάΠϯΛ࡞Ε Δ • 100ߦҎͰͬ͘͞ΓԋࢉࢠΦʔόϥΠυΛ࣮ ݱͰ͖Δ BabelͰͰ͖Δ͜ͱͷྫ
https://github.com/erukiti/autodebugger
͜Ε͔Βͷϝλϓϩάϥϛϯά • BabelͷΤίγεςϜʹ͔ͬΔ • جຊࣄલbuild • ։ൃ࣌ߦͤಈతॻ͖͑Մೳ • ίʔσΟϯάλΠϜίϯύΠϧͱ͍͏৽ٕज़
ίʔσΟϯάλΠϜίϯύΠϧ
None
s2s - source to source • @akameco ͞ΜͷϓϩμΫτ • ϑΝΠϧ͕࡞ɾߋ৽͞ΕͨΒࣗಈͰBabelϓϥά
ΠϯΛΒͤΔ • React/ReduxΛߴίʔσΟϯά • ίʔσΟϯά్தͰΔίϯύΠϧ͔ͩΒίʔσΟ ϯάλΠϜίϯύΠϧ
s2sͰͰ͖Δ͜ͱ • ReduxͷreducerΛՃͨ͠Βɺউखʹ combineReducers͞ΕΔ • ϑΝΠϧΛtouchͨ͠ΒςϯϓϨʔτ͕ࣗಈల։ • ؔΛॻ͍ͨΒJsDoc͕ࣗಈੜ͞ΕΔ • ؔΛॻ͍ͨΒɺରԠ͢ΔϢχοτςετ͕ࣗಈੜ
͞ΕΔ
ΞΠσΞ͍ͬͺ͍ɺເ͍ͬͺ͍ • ܕਪͰࣗಈͰܕΛ͚ͭΔ • ܕใ͔ΒassertΛࣗಈੜ • ָͳॻ͖ํͰܖϓϩάϥϛϯάΛ࣮ݱ͢Δ • طଘͷͷΑΓڧྗͳproperty based
testing͕࣮ݱͰ͖ͦ ͏ • ΤϯτϦϙΠϯτΛॻ͍ͨΒࣗಈͰJSON Scheme Λੜ͢Δ
ASTΛ৮Δ͚ͩ͡Όͳ͍ • ࠷ۙϋϯυϥʔͱ͍͏Έ͕ೖͬͯɺBabelϓ ϥάΠϯҎ֎ΒͤΒΕΔΑ͏ʹͳͬͨ • JavaScript, TypeScriptʹݶΒͣ͋ΒΏΔͷΛ watchͯ͠JSͷίʔυ͋Δ͍ଞͷԿ͔ʹม ͢Δ͜ͱͰ͖Δ •
ྫ͑pegjsΛίʔσΟϯάλΠϜͰมͰ͖Δ
ίʔσΟϯάλΠϜίϯύΠϧ • ίʔσΟϯά͠ͳ͕ΒϦΞϧλΠϜͰιʔείʔ υ͕ల։͞ΕΔ • ίϯύΠϧࡁΈͳͷͰɺVSCodeͳͲIDEͷࢧ ԉΛ࠷େݶड͚ΒΕΔ • ܕใ׆༻͠์
͜Ε͔Βͷϓϩάϥϛϯάͷਖ਼ٛ • ίʔσΟϯάλΠϜίϯύΠϧͱ͍͏৽ٕज़ • ஆ͔ΈᷓΕΔख࡞ۀΛࠜઈ • ੜ࢈ੑΛ্ͯ͠ɺ૬ରۚΛ্͛Δ
ࠂ • ٕज़ॻయ3Ͱ൦ͨ͠ʰ؆୯JavaScript ASTೖ ʱͬͯΔͷͰख͠Ͱ൦Ͱ͖·͢ɻ • લճͷModern JavaScriptʹଓ͍ͯɺASTຊ ۀԽ࡞ۀਐߦதͰ͢ɻ •
ۀ൛JSຊɺΞοϓσʔτ༧ఆͰ͢ɻ