Upgrade to Pro — share decks privately, control downloads, hide ads and more …

console.animate

katashin
September 15, 2017
Programming
2
2.6k

 console.animate

ToKyoto.js ― Kyoto.js in Tokyo
https://kyotojs.connpass.com/event/64310/

katashin

September 15, 2017
Tweet

More Decks by katashin

See All by katashin
テストの重要性 / Test is Important
ktsn
0
190
Gulp のビルドをもっと効率化するツールを作ってみた / Making a Tool for Optimizing a Build Process of Gulp
ktsn
2
2.3k
ラムダ計算入門 / Introduction of Lambda Calculus
ktsn
0
320
Contextual ThisType and Vue.js
ktsn
0
13k
TypeScript で型検査器を作る / Implementing a type checker with TypeScript
ktsn
0
22k
大規模静的サイトのためのビルドツール
ktsn
0
2.2k
型付きテンプレートがほしい
ktsn
1
44k
Toward Type Safety of Vuex
ktsn
1
970
Vue の TypeScript 事情
ktsn
1
2.6k

Other Decks in Programming

See All in Programming
自分のために作ったアプリが、グローバルに使われるまで / Indie App Development Lunch LT
pixyzehn
1
150
サービスクラスのありがたみを発見したときの思い出 #phpcon_odawara
77web
4
640
Code smarter, not harder - How AI Coding Tools Boost Your Productivity | Webinar 2025
danielsogl
0
120
ミリしらMCP勉強会
watany
4
750
MCP調べてみました！ / Exploring MCP
uhzz
2
2.3k
Boost Your Performance and Developer Productivity with Jakarta EE 11
ivargrimstad
0
1.4k
メモリウォールを超えて：キャッシュメモリ技術の進歩
kawayu
0
1.9k
DomainException と Result 型で作る型安全なエラーハンドリング
karszawa
0
900
Memory API : Patterns, Performance et Cas d'Utilisation
josepaumard
0
110
PHPバージョンアップから始めるOSSコントリビュート / how2oss-contribute
dmnlk
1
1k
Making TCPSocket.new "Happy"!
coe401_
1
390
Sharing features among Android applications: experience feedback
jbvincey
0
100

Featured

See All Featured
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
52
2.4k
YesSQL, Process and Tooling at Scale
rocio
172
14k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
19
1.1k
Speed Design
sergeychernyshev
29
890
Agile that works and the tools we love
rasmusluckow
328
21k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
31
1.1k
How STYLIGHT went responsive
nonsquared
99
5.5k
Automating Front-end Workflow
addyosmani
1369
200k
How GitHub (no longer) Works
holman
314
140k
Facilitating Awesome Meetings
lara
54
6.3k
Optimizing for Happiness
mojombo
377
70k

Transcript

  1. console.animate

  2. !LUTO LBUBTIJO

  3. ͬͪ͜ͷ࿩͡Όͳ͍Ͱ͢

  4. IUUQTEFWPSPDPN

  5. None
  6. None

  7. render(‘͜Μʹͪ͸’) ͜Μʹͪ͸ <canvas> [0, 0, 0, 0, 0, 0, 0,

    209, 0, …] ImageData

  8. [0, 0, 0, 0, 0, 0, 0, 209, 0, 0,

    0, 255, …] ImageData SFE HSFFO CMVF BMQIB

  9. BMQIBͰUSVFɹͦΕҎ֎ͰGBMTF [ [f, f, f, f, f, f, … ],

    [f, f, f, f, f, f, … ], [f, f, f, f, t, t, … ], [f, f, f, f, t, t, … ], [f, f, f, f, f, f, … ], … ]

  10. पลͷGBMTFΛמΓऔΔ [ [f, f, f, f, f], [f, t, t,

    t, f], [f, t, t, t, f], [f, f, f, f, f] ]

  11. 5SVFˠ˙ɹGBMTFˠ˘ [ [˘, ˘, ˘, ˘, ˘], [˘, ˙, ˙,

    ˙, ˘], [˘, ˙, ˙, ˙, ˘], [˘, ˘, ˘, ˘, ˘] ]

  12. 7JFXQPSUΛͣΒͯ͠Ξχϝʔγϣϯ DPOTPMFDMFBSˠDPOTPMFMPHˠʜ [ [˘, ˘, ˘, ˘, ˘], [˘, ˙,

    ˙, ˙, ˘], [˘, ˙, ˙, ˙, ˘], [˘, ˘, ˘, ˘, ˘] ]

  13. ΧʔιϧͳΜͯͳ͍ͷͰ DPOTPMFDMFBSˠDPOTPMFMPHˠʜ

  14. ʊਓਓਓਓʊ
 ʼɹ׬੒ɹʻ
 ʉ:?:?:?:ʉ

  15. 'JSFGPY $ISPNF 4BGBSJ

  16. ͳ͔ͥ'JSFGPYͷEFWUPPMͷύϑΥʔϚϯε ͕܈Λൈ͍ͯྑ͍ DPOTPMFMPHͷୈೋҾ਺ʹ͸ελΠϧΛ౉ͤΔ console.log('%cfoo’, 'font-size: 10px;') DBOWBTʹେ͖Ίʹॻ͍͔ͯΒ খ͍͞αΠζͰDPOTPMFMPH͢Δͷ͕ྑ͍ײ͡ ஌ݟ

  17. ࣍͸Τοδݕग़ʜʜʁ render(‘’)