開発上の様々な依存のつらみと FRESH! by AbemaTV の話

1644fba8a219c89987390ef4f23d06bf?s=47 Ayumu Sato
October 15, 2016

開発上の様々な依存のつらみと FRESH! by AbemaTV の話

AbemaTV Developer Conference 2016 http://developer.abema.io/ で使用したスライドです。本編 20 分。

1644fba8a219c89987390ef4f23d06bf?s=128

Ayumu Sato

October 15, 2016
Tweet

Transcript

  1. Ꟛ涪♳ך圫ղז⣛㶷ך鳞 א׵ ׫ה '3&4)CZ"CFNB57ך鑧 "CFNB57%FWFMPQFS$POGFSFODF !BIPNV"ZVNV4BUP

  2. ְ׉׿ ս⣛㶷վ շせ٥أ荈ո➭ך׮ךח״׶ַַ׶ծ ׉׸ח״׏ג䧭׶甧אֿהկ

  3. ‣ ـٓؐؠח㼎ׅ׷⣛㶷 ‣ 'MBTIח㼎ׅ׷⣛㶷 ‣ ٓ؎ـٓٔח㼎ׅ׷⣛㶷 ،آؑٝت

  4. IUUQTBCFNBGSFTIUW '3&4)CZ"CFNB57

  5. ‣ *TPNPSQIJD"SDIJUFDUVSF ‣ 3FBDU 'MVYJCMFד443ה41"׾⚕甧 ‣ 'MBTIPS8FC垥彊䪮遭ז⹛歗فٖ؎َ٦ ‣ 8FC4PDLFUח״׷ٔ،ٕة؎يثٍحز 䪮遭أةحؙ

  6. IUUQTTQFBLFSEFDLDPNBIPNVDMJFOUTJEFPGGSFTI 剢ח/PEF㷕㕦ד涪邌׃ת׃׋

  7. ֿ׿ח׍כ !BIPNVדׅ

  8. ‣ ⡟谏娄ׁהֲ֮ײ׬ ‣ せ〢㾊ה幪靼׾䖂䗁⚥ך8FCؒٝآص، ‣ 剑鵚ךꟼ䗰כXFCQFSGהBZ ‣ 吳 $ZCFS"HFOUַ׵ 吳

    "CFNB57⳿ぢ⚥  "NFCB窟䭍䪮遭劤鿇8FC*OJUJBUJWF$FOUFS !BIPNV
  9. Frontend Weekly IUUQTGSPOUFOEXFFLMZUPLZP 㕂ⰻ㢩ךؿٗٝزؒٝسꟼ鸬صُ٦أ׾嫣鹈ֶ㾈ֽׅ׷ً٦ٕوؖآٝ

  10. ΍ـٓؐؠח㼎ׅ׷⣛㶷

  11. 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
  12. ‣ ـٓؐؠך珏겲 ‣ رغ؎أך堣珏 ‣ رغ؎أך䚍腉 ‣ أؙٔ٦ٝ؟؎ؤ ‣ طحزٙ٦ؙך鸞䏝

    ـٓؐؠ⟃㢩ך䟝㹀勴⟝׮㢳ְ
  13. ➂➂➂➂➂➂➂➂➂➂➂➂➂ խ؟ه٦زׅץֹ橆㞮ָ㢳ְխ :?:?:?:?:?:?:?:?:?:?:?:

  14. 暴חꨇ⭑׃גְ׷ךָ ؟٦ؽأך欰ㄏ简

  15. None
  16. 1MBZFSGPS)551-JWF4USFBNJOH أزٔ٦ىؚٝ⹛歗فٖ؎َ٦

  17. ꞿ儗꟦ⱄ欰דז׿הזֻ姺ת׷ֿהָ֮׷ծהַך切僳זⱄ植ָ暴חֹאְ غٔؒ٦ءّٝذأزָא׵ְ

  18. ‣ 姻䌢 ‣ 僥⫷ָؙؕאָֻ鏩㺁דֹ׷ ‣ 僥⫷ָؙؕאֻג؎ٓ׏הׅ׷ ‣ 僥⫷ָ姺ת׷荈⹛䗁䌓 ‣ 僥⫷ָ姺ת׷宕⛉⨡姺

    ‣ ⹛ַזְ ➂⸂ذأزפך铬ꆃ
  19. ‣ 8FC垥彊ז植➿ד׮ـٓؐؠ꟦ך䊴殯כ֮׷ ‣ ׉׃גFYCPY娤כ麐㖈ׅ׷ ‣ "OESPJE#SPXTFSחֶֽ׷)-4娤׮麐㖈ׅ׷ ‣ 8JOך*&ח.4& .FEJB4PVSDF&YUFOTJPOT כזְ

    ְ׻ײ׷ـٓؐؠ⣛㶷ך㉏겗
  20. ‣ *&ד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));ָؒٓ٦הַ
  21. $ISPNF'Yד⹛ַׇ׋ֻ׵ְד 屘倖׃׋׵⽯娤ׅ׷⚅歲錁 ߋʹɺ͋Δఔ౓շదͳ Windows Ϛγϯ΋ৗඋ͠ͳ͍ͱײ͕֮ಷΔ

  22. Ύ'MBTIח㼎ׅ׷⣛㶷

  23. ➂➂➂➂➂➂➂➂➂➂➂➂➂ խ'MBTIָ$ISPNFד⹛ַזְխ :?:?:?:?:?:?:?:?:?:?:?:

  24. ،ً٦غؾؚךؐ؍آؑحزػ٦خ '3&4)ך&NCFEفٖ؎َ٦ 䔲儗  ˟➙כ"CFNB57ך꫼姺歗⫷ח➿׻׏גְ׷

  25. IUUQTIBWFMPHBZVNVTBUPDPNEFWFMPQPUIFSTFBVUPQMBZ@BE@BTIIUNM 㼭ְׁ'MBTI׾ⱄ欰ׇׁ׷㔐鼘䩛媮

  26. 'MBTIח㼎ׅ׷⣛㶷

  27. ‣ )551-JWF4USFBNJOHדׅ ‣ ⹛歗׾أزٔ٦ىؚٝד崧ׅ鋉呓דׅ ‣ '3&4)׮"CFNB57׮ְתךהֿ׹)-4 ‣ )-4ך鑫稢כծֿך䖓ךإحءַّٝխ 3PPN"ךꟚ㨣ךإحءّٝ׾⿫罋ח )-4הְֲ׮ך

  28. ‣ 畭涸ח8FC垥彊ז㹋鄲׾ׁ׸׋ٓ؎ـָٓٔ ֮׵ײ׷橆㞮ד㸜㹀דֹ׷קו卫׸גְזְ ‣ 嫰鯰ׅ׷ה'MBTI㹋鄲כ㦩ח㸜㹀׃גְ׷ ‣ ׋׌׃$16כـٝ㔐ׁ׸׷ ‣ 军䨺䚍腉ָ넝ת׷ 'MBTI㹋鄲ד)-4׾ⱄ欰

  29. 鶕׷剑䖓ך㻢ⴻ

  30. ‣ $ISPNFהד媮ꥡ涸חـٗحؙ׾Ꟛ㨣 ‣ 4BGBSJכַ׵琎噰涸זـٗحؙ׾Ꟛ㨣 ‣ 'JSFGPYה&EHF׮媮ꥡ涸חـٗحؙך倯ꆙ ‣ *OUFSOFU&YQMPSFSכ'MBTIהⰟח嶊ִײֻ 㻢ⴻך傈ծ鹌䯴וֲדַׅ

  31. IUUQTIBWFMPHBZVNVTBUPDPNEFWFMPQPUIFSTFSVJO@PG@BTIIUNM 'MBTI⺪㔲笨ך植朐

  32. None
  33. None
  34. 膴'MBTI⣛㶷

  35. None
  36. None
  37. None
  38. ‣ EBJMZNPUJPOIMTKT׾䱰欽 ‣ .FEJB4PVSDF&YUFOTJPOTⵃ欽鑫׃ֻכ SZ ‣ $ISPNFה&EHFחぢֽג䲿⣘⚥ ‣ 'JSFGPY 4BGBSJכ갫如䲿⣘ծ*&כ'MBTI竰竲

    膴'MBTI鹌䯴׃גתׅ
  39. Ώٓ؎ـٓٔח㼎ׅ׷⣛㶷

  40. OQNהCSPXTFSJGZ ؕآُ،ٕז⣛㶷ך鍑犜

  41. ‣ 醱꧟ז㉏겗׾鸞װַח鍑寸דֹ׷ ‣ 044涸זㅷ颵䬐⥂׾劍䖉דֹ׷  ⹛⡲㹋籐  堣腉鷄⸇  غؚ⥜姻FUD

    ⣛㶷ךًٔحز
  42. ‣ ؝، SFBDU VYJCMF BOHVMBS  ‣ ِ٦ذ؍ٔذ؍ NPNFOU JNNVUBCMF

    SY  ‣ ؿ؋ؙٝءّٝ MPEBTI MFGUQBE  ‣ هٔؿ؍ٕ XIBUXHGFUDI FTQSPNJTF  ‣ 6*؝ٝه٦طٝز DBSPVTFM QBHJOBUF ٓ؎ـٓٔ⣛㶷ךⴓ겲
  43. ‣ ًاحسך׋׭ח⟒ղ׃ְٓ؎ـٓٔכ– ‣ +4ךغٝسٕ؟؎ؤ׾罋䣁ׅ׷ה㣐磛כ㔭׷ ‣ ًاحس׀החJNQPSUדֹ׷ה⸔ַ׷ ‣ ⢽ִל3Y+4Wהַכ孡׾黎׏גֻ׸גְ׷ ِ٦ذ؍ٔذ؍ך磛䏝

  44. ‣ Ⰵ䙀זㅷ颵ثؑحָؙ䗳銲 ‣ 3FBDU،حفر٦ز儗ח駈׾䒷׏䓸׵׸ָ׍ ‣ 暴婊銲⟝׮GPSLׅ׸לוֲהד׮ז׷ָ ‣ 穠㽷ؔ٦ت٦ً؎زה㢌׻׵זֻז׷䠬 ➭➂ך6*؝ٝه٦طٝز

  45. ⣛㶷خٔ٦׾搀꠹ח 㣐ֹֻ׃זְ⸕⸂׮䗳銲

  46. ⣛㶷ٓ؎ـٓٔꟼ鸬ך زٓـٕءُ٦ذ؍ؚٝ

  47. ‣ *TPNPSQIJDזSPVUFד㣐ꆀךر٦ة׾《䖤 ‣ 䲽歗ׅץֹ銲稆ָ㢳ֻז׷⚺חٔأز禸 ‣ SFOEFS5P4USJOHָꅾֻז׷ ‣ ؙٓ؎،ٝزך׫ד鹼䒀㹋遤ׅ׷խխխխ SPVUFⳢ椚׾鷄⸇׃ג鍑寸✮㹀 3PVUFהSFOEFS5P4USJOH

  48. // αόΫϥ྆ํͰϧʔςΟϯά࣌ʹ࣮ߦ 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)); }
  49. ‣ 4UPSFַ׵*NNVUBCMFז.BQװ-JTUָ䲿⣘ ‣ 䲿⣘ׁ׸׋ؔـآؙؑزכTUBUFד⥂䭯 ‣ SFOEFSⰻדTUBUFGPPUP+4  ‣ SFOEFSׅ׷׋ןחUP+4 ך؝أز넝ֺׅ娤

    *NNVUBCMFKTהSFOEFS
  50. 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> ); }
  51. IUUQTDIOFUQPTUTBCFNBUWSVOUJNFQFSGBVEJUIUNM "CFNB57ךٓٝة؎يػؿؓ٦وٝأך"VEJU

  52. תה׭

  53. ‣ فٖ؎َ٦嗚鏾׋ְפ׿ ‣ 8JEOPXT⢪ֲֶ ‣ 膴'MBTIָ׿ל׹ֲ ‣ ⣛㶷خٔ٦ך㣐ֹׁכ罋ִ״ֲ ‣ 8FCꟚ涪׏ג嚂׃ְ

    תה׭
  54. $IFFST IUUQBIPNV !BIPNV HJUIVCDPNBIPNV ! " ⌂