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
社内ツールから生まれたOSS "ts-remove-unused" によるフロントエンド開発の...
Search
LINEヤフーTech (LY Corporation Tech)
PRO
December 13, 2023
Technology
0
640
社内ツールから生まれたOSS "ts-remove-unused" によるフロントエンド開発の効率化と品質の向上
「UIT × Bonfire Front-end Meetup #1」の発表資料です。
https://uit.connpass.com/event/300284/
LINEヤフーTech (LY Corporation Tech)
PRO
December 13, 2023
Tweet
Share
More Decks by LINEヤフーTech (LY Corporation Tech)
See All by LINEヤフーTech (LY Corporation Tech)
マルチモーダル基盤モデルに基づく動画と音の解析技術
lycorptech_jp
PRO
9
680
AI駆動開発 with MixLeap Study【大阪支部 #3】
lycorptech_jp
PRO
0
340
Yahoo!しごとカタログ 新しい境地を創るエンジニア募集!
lycorptech_jp
PRO
3
410
データグループにおけるフロントエンド開発
lycorptech_jp
PRO
2
840
Yahoo!知恵袋におけるフロントエンド開発
lycorptech_jp
PRO
0
870
"LINE Planet" and AI: Conversations with AI
lycorptech_jp
PRO
0
75
Seamless inventory management with AI
lycorptech_jp
PRO
0
41
AI Frontiers Revealed: Transforming LINE Shopping TW with LLM-Driven Product Attribute Extraction
lycorptech_jp
PRO
0
64
LINEヤフーの音声AIがもたらす未来:ASR/TTSと対話技術の新たな可能性 / LY Corporation's Speech AI Vision: Towards Realtime Spoken Dialogue through Advanced ASR and TTS
lycorptech_jp
PRO
0
75
Other Decks in Technology
See All in Technology
生成AI利用プログラミング:誰でもプログラムが書けると 世の中どうなる?/opencampus202508
okana2ki
0
170
AIが住民向けコンシェルジュに?Amazon Connectと生成AIで実現する自治体AIエージェント!
yuyeah
0
230
UDDのススメ - 拡張版 -
maguroalternative
1
640
プロジェクトマネジメントは不確実性との対話だ
hisashiwatanabe
0
170
MySQL HeatWave:サービス概要のご紹介
oracle4engineer
PRO
4
1.6k
あなたの知らない OneDrive
murachiakira
0
140
Autonomous Database Serverless 技術詳細 / adb-s_technical_detail_jp
oracle4engineer
PRO
18
52k
人を動かすことについて考える
ichimichi
2
160
Rethinking Incident Response: Context-Aware AI in Practice - Incident Buddy Edition -
rrreeeyyy
0
120
Claude Code x Androidアプリ 開発
kgmyshin
1
380
2025新卒研修・Webアプリケーションセキュリティ #弁護士ドットコム
bengo4com
3
9.7k
Amazon Bedrock AgentCore でプロモーション用動画生成エージェントを開発する
nasuvitz
6
290
Featured
See All Featured
Designing for Performance
lara
610
69k
The Cost Of JavaScript in 2023
addyosmani
53
8.8k
Practical Orchestrator
shlominoach
190
11k
GitHub's CSS Performance
jonrohan
1031
460k
Mobile First: as difficult as doing things right
swwweet
223
9.9k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
1k
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3.4k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
53
2.9k
Raft: Consensus for Rubyists
vanstee
140
7.1k
Automating Front-end Workflow
addyosmani
1370
200k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
161
15k
Transcript
,B[VTIJ,POPTV !LB[VTIJLPOPTV -:$PSQPSBUJPO ࣾπʔϧ͔Βੜ·Εͨ044 lUTSFNPWFVOVTFEz ʹΑΔϑϩϯτΤϯυ։ൃͷޮԽͱ࣭ͷ্ 6*5ʷ#PO fi SF'SPOUFOE.FFUVQ
HJUIVCDPNMJOFUTSFNPWFVOVTFE
. ├── node_modules/ ├── src/ │ ├── App.tsx │ ├──
Button.tsx │ └── Heading.tsx └── package.json ػೳͷհ
// src/App.tsx import { ReactNode } from 'react'; import {
render } from 'react-dom'; import { Button } from './Button'; const App = () => ( <div> <Button>click me</Button> </div> ); render(<App />, document.querySelector('#app')); // src/Heading.tsx export const Heading = () => <h1>My Sample App</h1>; // src/Button.tsx export const Button = ({ children }: { children?: ReactNode }) => ( <button type="button">{children}</button> ); export const label = 'button label'; #FGPSF
// src/App.tsx import { ReactNode } from 'react'; import {
render } from 'react-dom'; const App = () => ( <div> <Button>click me</Button> </div> ); render(<App />, document.querySelector('#app')); // src/Button.tsx export const Button = ({ children }: { children?: ReactNode }) => ( <button type="button">{children}</button> ); "GUFS
@@ -11,12 +11,7 @@ const App = () => (
render(<App />, document.querySelector('#app')); -// src/Heading.tsx -export const Heading = () => <h1>My Sample App</h1>; - // src/Button.tsx export const Button = ({ children }: { children?: ReactNode }) => ( <button type="button">{children}</button> ); - -export const label = 'button label'; %JGG
UTSFNPWFVOVTFEͱ FYQPSU͞Ε͍ͯΔ͜ͱͰؾ͖ͮʹ͍͘σουίʔυΛࣗಈͰআ͢Δπʔϧ w ;FSPDPO fi H w UTDPO fi HKTPOΛͱʹʮΘΕ͍ͯΔʯ͜ͱΛஅ
w ඞཁͳϑΝΠϧPQUJPOͰແࢹͰ͖Δ
τϐοΫ w Ϟνϕʔγϣϯ w 5ZQF4DSJQUίʔυΛม͢ΔͱͲ͏͍͏͜ͱ͔ w ม͢Δํ๏ w πʔϧ͕ͨΒͨ͠ޮՌ w
044Խ
Ϟνϕʔγϣϯ 5ZQF4DSJQUίʔυΛม͢ΔͱͲ͏͍͏͜ͱ͔ ม͢Δํ๏ πʔϧ͕ͨΒͨ͠ޮՌ 044Խ
Ϟνϕʔγϣϯ w ίϯϙʔωϯτϥΠϒϥϦͷஔ͖͑Λ͖͔͚ͬʹσουίʔυ͕ݦࡏԽ w ϞδϡʔϧͷґଘؔΛ୧Δඞཁ͕͋Γ؆୯ʹআͰ͖ͳ͍ w ࣗಈԽͰ͖Εຬ
Ϟνϕʔγϣϯ 5ZQF4DSJQUίʔυΛม͢ΔͱͲ͏͍͏͜ͱ͔ ม͢Δํ๏ πʔϧ͕ͨΒͨ͠ޮՌ 044Խ
ߏจ ίʔυߏจʹม͞ΕΔ export const message: string = 'hello world';
5ZQF4DSJQUίϯύΠϥ͕͍ͬͯΔ͜ͱ ߏจͷঢ়ଶͰܕνΣοΫ+BWB4DSJQUͷมॲཧ͕ߦΘΕΔ export const message = 'hello world'; export const
message: string = 'hello world'; ίʔυ ߏจ ߏจ ίʔυ QBSTF DPOWFSU QSJOU
5ZQF4DSJQUίʔυΛม͢ΔͱͲ͏͍͏͜ͱ͔ ߏจͷϊʔυΛՃɾআɾฤू͢Δૢ࡞Λॻ͘͜ͱ ߏจ ߏจ ૢ࡞
5ZQF4DSJQU"457JFXFS
Ϟνϕʔγϣϯ 5ZQF4DSJQUίʔυΛม͢ΔͱͲ͏͍͏͜ͱ͔ ม͢Δํ๏ πʔϧ͕ͨΒͨ͠ޮՌ 044Խ
5ZQF4DSJQU$PNQJMFS"1* ͕Δ͜ͱ ࣗͰΔ͜ͱ ύʔε ϓϦϯτ τϥόʔε τϥόʔε֤ͨ͠ϊʔυͷૢ࡞
5ZQF4DSJQU$PNQJMFS"1*Λ࣮ࡍʹͬͯΈΔ export const message: string = 'hello world';
import ts, { Node, ScriptTarget } from "typescript"; const code
= ` export const message: string = 'hello world'; `; const sourceFile = ts.createSourceFile( "src/index.ts", code, ScriptTarget.ES2022 ); const visitor = (depth: number) => (node: Node) => { console.log( `${Array(depth).fill("-").join("")}> [${ ts.SyntaxKind[node.kind] }] ${node.getText(sourceFile)}` ); ts.forEachChild(node, visitor(depth + 1)); }; ts.forEachChild(sourceFile, visitor(1));
-> [FirstStatement] export const message: string = 'hello world'; -->
[ExportKeyword] export --> [VariableDeclarationList] const message: string = 'hello world' ---> [VariableDeclaration] message: string = 'hello world' ----> [Identifier] message ----> [StringKeyword] string ----> [StringLiteral] 'hello world' -> [EndOfFileToken]
UTNPSQIͰૢ࡞͕ΑΓ؆୯ʹ w 5ZQF4DSJQU$PNQJMFS"1*গ͠ϋʔυϧ͕ߴ͍ w $PNQJMFS"1*ͷϘΠϥʔϓϨʔτίʔυΛݮͰ͖Δ w Α͘͏ૢ࡞Λؔͱͯ͠ఏڙ w ϩʔϨϕϧͳ"1*ʹΞΫηεͰ͖Δ UTNPSQIΛ׆༻͢Δ͜ͱͰΑΓεϐʔσΟʹ࣮ݱͰ͖ͨ
Ϟνϕʔγϣϯ 5ZQF4DSJQUίʔυΛม͢ΔͱͲ͏͍͏͜ͱ͔ ม͢Δํ๏ πʔϧ͕ͨΒͨ͠ޮՌ 044Խ
։ൃΛৼΓฦͬͯ w ࣾπʔϧͯ͢ͷέʔεΛΧόʔ͢Δඞཁͳ͍ w ίʔυϨϏϡʔͰ࣭Λ୲อ w ϥΠϒϥϦͷҠߦ࡞ۀΛߴԽ
ٴͨ͠ޮՌ w ϩδοΫʹઐ೦Ͱ͖ΔͨΊϦϑΝΫλϦϯάͷϋʔυϧ͕Լ͕Δ w ؾ͔ͮͳ͔ͬͨσουίʔυͷଘࡏ͕໌Β͔ʹͳΔ
Ϟνϕʔγϣϯ 5ZQF4DSJQUίʔυΛม͢ΔͱͲ͏͍͏͜ͱ͔ ม͢Δํ๏ πʔϧ͕ͨΒͨ͠ޮՌ 044Խ
044ԽͷܦҢ ϓϩμΫτͷϦϙδτϦʹ࣮ ݕূͰ͖ͨλΠϛϯάͰผϦϙδτϦʹΓग़͠ ࣾ/1.Ͱެ։ (JUIVCͰ044Խ
044ԽͷϝϦοτ w ࣾ֎Ͱ͕ࣗ࡞ͬͨίʔυΛ͑Δ w ࣾͷೝΛߴΊΔ͜ͱ͕Ͱ͖Δ w ۀ࣌ؒΛͬͯπʔϧΛվળͰ͖Δ w ࣾͷผϦϙδτϦʹల։͘͢͠ͳͬͨ
·ͱΊ w ϥΠϒϥϦͷҠߦͰൃੜ͢ΔσουίʔυͷআΛࣗಈԽ w ίʔυͷม͖ͭͭΊΔͱߏจͷมॲཧΛॻ͘͜ͱ w 5ZQF4DSJQU$PNQJMFS"1*ͦΜͳʹ͘͠ͳ͍ w πʔϧ࡞ΓϓϩμΫτ։ൃͷݱͰʹͨͭ w
044ԽͰࣾ֎ʹؐݩɾࣾʹల։
HJUIVCDPNMJOFUTSFNPWFVOVTFE