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
開発上の様々な依存のつらみと FRESH! by AbemaTV の話
Search
Ayumu Sato
October 15, 2016
Programming
18
9.8k
開発上の様々な依存のつらみと FRESH! by AbemaTV の話
AbemaTV Developer Conference 2016
http://developer.abema.io/
で使用したスライドです。本編 20 分。
Ayumu Sato
October 15, 2016
Tweet
Share
More Decks by Ayumu Sato
See All by Ayumu Sato
Web 開発の長距離走と持続可能性 - TechFeed Experts Night#31 〜 フロントエンドアーキテクチャの現状と未来
ahomu
1
200
控えめな App Router と持続可能な開発 - PWA Night vol.59
ahomu
11
2.9k
GPT 生成物の評価、運用 toC 企画でのハードルと勘所
ahomu
0
300
副業をきっかけに 切り拓くキャリア形成
ahomu
1
150
Webフロントエンドと アーキテクチャ事情の持論を喋る
ahomu
2
1.7k
SPA/MPA 議論の俯瞰と 現代における設計のポイント - #tfcon 2022 フロントエンド設計
ahomu
5
3.7k
#TECHPLAY Talk - 理想的な Web のため MUST 駆動で主語が大きくなったキャリア
ahomu
0
290
最近の Web パフォーマンス改善について知っておきたいコト
ahomu
50
20k
Web フロントエンドで大切なことはすべて Audits が教えてくれた
ahomu
1
630
Other Decks in Programming
See All in Programming
Prism.parseで 300本以上あるエンドポイントに 接続できる権限の一覧表を作ってみた
hatsu38
1
110
Development of an App for Intuitive AI Learning - Blockly Summit 2025
teba_eleven
0
120
Effect の双対、Coeffect
yukikurage
5
1.4k
LINEヤフー データグループ紹介
lycorp_recruit_jp
0
730
データの民主化を支える、透明性のあるデータ利活用への挑戦 2025-06-25 Database Engineering Meetup#7
y_ken
0
140
Benchmark
sysong
0
210
複数アプリケーションを育てていくための共通化戦略
irof
10
3.9k
レガシーシステムの機能調査・開発におけるAI利活用
takuya_ohtonari
0
600
Beyond Portability: Live Migration for Evolving WebAssembly Workloads
chikuwait
0
380
業務自動化をJavaとSeleniumとAWS Lambdaで実現した方法
greenflagproject
1
120
Enterprise Web App. Development (2): Version Control Tool Training Ver. 5.1
knakagawa
1
110
Gleamという選択肢
comamoca
6
740
Featured
See All Featured
Let's Do A Bunch of Simple Stuff to Make Websites Faster
chriscoyier
507
140k
Gamification - CAS2011
davidbonilla
81
5.3k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
32
2.3k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
46
9.6k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
52
2.8k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.2k
Statistics for Hackers
jakevdp
799
220k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
6
690
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
35
2.3k
Rails Girls Zürich Keynote
gr2m
94
14k
GitHub's CSS Performance
jonrohan
1031
460k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Transcript
涪♳ך圫ղז⣛㶷ך鳞 א ה '3&4)CZ"CFNB57ך鑧 "CFNB57%FWFMPQFS$POGFSFODF !BIPNV"ZVNV4BUP
ְ ս⣛㶷վ շせ٥أ荈ո➭ךךח״ַַծ ח״ג䧭甧אֿהկ
‣ ـٓؐؠח㼎ׅ⣛㶷 ‣ 'MBTIח㼎ׅ⣛㶷 ‣ ٓ؎ـٓٔח㼎ׅ⣛㶷 ،آؑٝت
IUUQTBCFNBGSFTIUW '3&4)CZ"CFNB57
‣ *TPNPSQIJD"SDIJUFDUVSF ‣ 3FBDU 'MVYJCMFד443ה41"⚕甧 ‣ 'MBTIPS8FC垥彊䪮遭ז⹛歗فٖ؎َ٦ ‣ 8FC4PDLFUח״ٔ،ٕة؎يثٍحز 䪮遭أةحؙ
IUUQTTQFBLFSEFDLDPNBIPNVDMJFOUTJEFPGGSFTI 剢ח/PEF㷕㕦ד涪邌׃ת׃
ֿחכ !BIPNVדׅ
‣ ⡟谏娄ׁהֲ֮ײ ‣ せ〢㾊ה幪靼䖂䗁⚥ך8FCؒٝآص، ‣ 剑鵚ךꟼ䗰כXFCQFSGהBZ ‣ 吳 $ZCFS"HFOUַ 吳
"CFNB57⳿ぢ⚥ "NFCB窟䭍䪮遭劤鿇8FC*OJUJBUJWF$FOUFS !BIPNV
Frontend Weekly IUUQTGSPOUFOEXFFLMZUPLZP 㕂ⰻ㢩ךؿٗٝزؒٝسꟼ鸬صُ٦أ嫣鹈ֶ㾈ֽًׅ٦ٕوؖآٝ
ـٓؐؠח㼎ׅ⣛㶷
Windows - Chrome latest - Firefox latest - Internet Explorer
11 w/Windows 7, 8.1, 10 - Microsoft Edge last 2 versions macOS (OS X) - Chrome latest - Firefox latest - Safari last 2 versions Android - Android Browser 4.1, 4.3, 4.4, 5-6.x (Chromium) iOS - Safari last 2 versions
‣ ـٓؐؠך珏겲 ‣ رغ؎أך堣珏 ‣ رغ؎أך䚍腉 ‣ أؙٔ٦ٝ؟؎ؤ ‣ طحزٙ٦ؙך鸞䏝
ـٓؐؠ⟃㢩ך䟝㹀勴⟝㢳ְ
➂➂➂➂➂➂➂➂➂➂➂➂➂ խ؟ه٦زׅץֹ橆㞮ָ㢳ְխ :?:?:?:?:?:?:?:?:?:?:?:
暴חꨇ⭑׃גְךָ ؟٦ؽأך欰ㄏ简
None
1MBZFSGPS)551-JWF4USFBNJOH أزٔ٦ىؚٝ⹛歗فٖ؎َ٦
ꞿ儗ⱄ欰דזהזֻ姺תֿהָ֮ծהַך切僳זⱄ植ָ暴חֹאְ غٔؒ٦ءّٝذأزָאְ
‣ 姻䌢 ‣ 僥⫷ָؙؕאָֻ鏩㺁דֹ ‣ 僥⫷ָؙؕאֻג؎ٓהׅ ‣ 僥⫷ָ姺ת荈⹛䗁䌓 ‣ 僥⫷ָ姺ת宕⛉⨡姺
‣ ⹛ַזְ ➂⸂ذأزפך铬ꆃ
‣ 8FC垥彊ז植➿דـٓؐؠך䊴殯כ֮ ‣ ׃גFYCPY娤כ麐㖈ׅ ‣ "OESPJE#SPXTFSחֶֽ)-4娤麐㖈ׅ ‣ 8JOך*&ח.4& .FEJB4PVSDF&YUFOTJPOT כזְ
ְײـٓؐؠ⣛㶷ך㉏겗
‣ *&דS"' 3FBDUךWBMVF-JOLָ窃،ٖהַ ‣ 4BGBSJװ&EHFָ稆ד)-4ⱄ欰׃ָاٖהַ ‣ 〢ך7דObject.assignך갫䎷ָ،ٖהַ ‣ &EHFד<use xlink:href>
iframeָاٖהַ ‣ mozRequestFull"S"creenהַMSFullscreenChangeהַ ‣ 8JO *&ך暴㹀ؽٕسחꣲגխխխխխխ new Worker(URL.createObjectURL(blob));ָؒٓ٦הַ
$ISPNF'Yד⹛ְַׇֻד 屘倖׃⽯娤ׅ⚅歲錁 ߋʹɺ͋Δఔշదͳ Windows Ϛγϯৗඋ͠ͳ͍ͱײ͕֮ಷΔ
Ύ'MBTIח㼎ׅ⣛㶷
➂➂➂➂➂➂➂➂➂➂➂➂➂ խ'MBTIָ$ISPNFד⹛ַזְխ :?:?:?:?:?:?:?:?:?:?:?:
،ً٦غؾؚךؐ؍آؑحزػ٦خ '3&4)ך&NCFEفٖ؎َ٦ 䔲儗 ˟➙כ"CFNB57ך姺歗⫷ח➿גְ
IUUQTIBWFMPHBZVNVTBUPDPNEFWFMPQPUIFSTFBVUPQMBZ@BE@BTIIUNM 㼭ְׁ'MBTIⱄ欰ׇׁ㔐鼘䩛媮
'MBTIח㼎ׅ⣛㶷
‣ )551-JWF4USFBNJOHדׅ ‣ ⹛歗أزٔ٦ىؚٝד崧ׅ鋉呓דׅ ‣ '3&4)"CFNB57ְתךהֿ)-4 ‣ )-4ך鑫稢כծֿך䖓ךإحءַّٝխ 3PPN"ך㨣ךإحءّٝ罋ח )-4הְֲך
‣ 畭涸ח8FC垥彊ז㹋鄲ׁٓ؎ـָٓٔ ֮ײ橆㞮ד㸜㹀דֹקו卫גְזְ ‣ 嫰鯰ׅה'MBTI㹋鄲כ㦩ח㸜㹀׃גְ ‣ ׃$16כـٝ㔐ׁ ‣ 军䨺䚍腉ָ넝ת 'MBTI㹋鄲ד)-4ⱄ欰
鶕剑䖓ך㻢ⴻ
‣ $ISPNFהד媮ꥡ涸חـٗحؙ㨣 ‣ 4BGBSJכַ琎噰涸זـٗحؙ㨣 ‣ 'JSFGPYה&EHF媮ꥡ涸חـٗحؙך倯ꆙ ‣ *OUFSOFU&YQMPSFSכ'MBTIהⰟח嶊ִײֻ 㻢ⴻך傈ծ鹌䯴וֲדַׅ
IUUQTIBWFMPHBZVNVTBUPDPNEFWFMPQPUIFSTFSVJO@PG@BTIIUNM 'MBTI⺪㔲笨ך植朐
None
None
膴'MBTI⣛㶷
None
None
None
‣ EBJMZNPUJPOIMTKT䱰欽 ‣ .FEJB4PVSDF&YUFOTJPOTⵃ欽鑫׃ֻכ SZ ‣ $ISPNFה&EHFחぢֽג䲿⣘⚥ ‣ 'JSFGPY 4BGBSJכ갫如䲿⣘ծ*&כ'MBTI竰竲
膴'MBTI鹌䯴׃גתׅ
Ώٓ؎ـٓٔח㼎ׅ⣛㶷
OQNהCSPXTFSJGZ ؕآُ،ٕז⣛㶷ך鍑犜
‣ 醱꧟ז㉏겗鸞װַח鍑寸דֹ ‣ 044涸זㅷ颵䬐⥂劍䖉דֹ ⹛⡲㹋籐 堣腉鷄⸇ غؚ⥜姻FUD
⣛㶷ךًٔحز
‣ ؝، SFBDU VYJCMF BOHVMBS ‣ ِ٦ذ؍ٔذ؍ NPNFOU JNNVUBCMF
SY ‣ ؿ؋ؙٝءّٝ MPEBTI MFGUQBE ‣ هٔؿ؍ٕ XIBUXHGFUDI FTQSPNJTF ‣ 6*؝ٝه٦طٝز DBSPVTFM QBHJOBUF ٓ؎ـٓٔ⣛㶷ךⴓ겲
‣ ًاحسךח⟒ղ׃ְٓ؎ـٓٔכ ‣ +4ךغٝسٕ؟؎ؤ罋䣁ׅה㣐磛כ㔭 ‣ ًاحس׀החJNQPSUדֹה⸔ַ ‣ ⢽ִל3Y+4Wהַכ孡黎גֻגְ ِ٦ذ؍ٔذ؍ך磛䏝
‣ Ⰵ䙀זㅷ颵ثؑحָؙ䗳銲 ‣ 3FBDU،حفر٦ز儗ח駈䒷䓸ָ ‣ 暴婊銲⟝GPSLׅלוֲהדזָ ‣ 穠㽷ؔ٦ت٦ً؎زה㢌זֻז䠬 ➭➂ך6*؝ٝه٦طٝز
⣛㶷خٔ٦搀꠹ח 㣐ֹֻ׃זְ⸕⸂䗳銲
⣛㶷ٓ؎ـٓٔꟼ鸬ך زٓـٕءُ٦ذ؍ؚٝ
‣ *TPNPSQIJDזSPVUFד㣐ꆀךر٦ة《䖤 ‣ 䲽歗ׅץֹ銲稆ָ㢳ֻז⚺חٔأز禸 ‣ SFOEFS5P4USJOHָꅾֻז ‣ ؙٓ؎،ٝزךד鹼䒀㹋遤ׅխխխխ SPVUFⳢ椚鷄⸇׃ג鍑寸✮㹀 3PVUFהSFOEFS5P4USJOH
// αόΫϥ྆ํͰϧʔςΟϯά࣌ʹ࣮ߦ action: (context, payload, done) { Promise.all([ context.executeAction(ͳʹ͔େࣄͳσʔλऔಘ1), context.executeAction(ͳʹ͔େࣄͳσʔλऔಘ2)
]) .then(() => done()) .catch((err) => done(err)); }, // ΫϥΠΞϯταΠυͷΈϧʔςΟϯάޙʹ࣮ߦ deferAction: (context, payload, done) { Promise.all([ context.executeAction(Εͯྑ͍σʔλऔಘ1), context.executeAction(Εͯྑ͍σʔλऔಘ2) ]) .then(() => done()) .catch((err) => done(err)); }
‣ 4UPSFַ*NNVUBCMFז.BQװ-JTUָ䲿⣘ ‣ 䲿⣘ׁؔـآؙؑزכTUBUFד⥂䭯 ‣ SFOEFSⰻדTUBUFGPPUP+4 ‣ SFOEFSׅןחUP+4 ך؝أز넝ֺׅ娤
*NNVUBCMFKTהSFOEFS
componentDidMount() { this.subscriptions.push( FooStore.foo$.subscribe(foo => { // foo: Immutable.Map this.setState({
foo }); }) ); } render() { // render ͕܁Γฦ͞ΕΔͨͼʹ toJS ͕૬ͳ࣌ؒΛͱΔ let foo = this.state.foo.toJS(); return ( <div> <h1>{foo.someProperty}</h1> </div> ); }
IUUQTDIOFUQPTUTBCFNBUWSVOUJNFQFSGBVEJUIUNM "CFNB57ךٓٝة؎يػؿؓ٦وٝأך"VEJU
תה
‣ فٖ؎َ٦嗚鏾ְפ ‣ 8JEOPXT⢪ֲֶ ‣ 膴'MBTIָלֲ ‣ ⣛㶷خٔ٦ך㣐ֹׁכ罋ִ״ֲ ‣ 8FC涪ג嚂׃ְ
תה
$IFFST IUUQBIPNV !BIPNV HJUIVCDPNBIPNV ! " ⌂