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
console.animate
Search
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
Share
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
310
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
Go1.24 go vetとtestsアナライザ
kuro_kurorrr
2
460
自分のために作ったアプリが、グローバルに使われるまで / Indie App Development Lunch LT
pixyzehn
1
120
PHPでお金を扱う時、終わりのない 謎の1円調査の旅にでなくて済む方法
nakka
3
1k
Node.js, Deno, Bun 最新動向とその所感について
yosuke_furukawa
PRO
6
3k
php-fpm がリクエスト処理する仕組みを追う / Tracing-How-php-fpm-Handles-Requests
shin1x1
5
820
Devin入門と最近のアップデートから見るDevinの進化 / Introduction to Devin and the Evolution of Devin as Seen in Recent Update
rkaga
7
3.7k
20250326_生成AIによる_レビュー承認システムの実現.pdf
takahiromatsui
17
5.4k
マルチアカウント環境での、そこまでがんばらない RI/SP 運用設計
wa6sn
0
580
신입 안드로이드 개발자의 AI 스타트업 생존기 (+ Native C++ Code를 Android에서 사용해보기)
dygames
0
500
Preact、HooksとSignalsの両立 / Preact: Harmonizing Hooks and Signals
ssssota
1
680
아직도 SOLID 를 '글'로만 알고 계신가요?
sh1mj1
0
360
Going Structural with Named Tuples
bishabosha
0
170
Featured
See All Featured
A Tale of Four Properties
chriscoyier
158
23k
Fontdeck: Realign not Redesign
paulrobertlloyd
83
5.4k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
46
2.4k
Adopting Sorbet at Scale
ufuk
75
9.3k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
135
33k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
4
490
Speed Design
sergeychernyshev
28
860
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.7k
For a Future-Friendly Web
brad_frost
176
9.6k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Done Done
chrislema
183
16k
Thoughts on Productivity
jonyablonski
69
4.5k
Transcript
console.animate
!LUTO LBUBTIJO
ͬͪ͜ͷ͡Όͳ͍Ͱ͢
IUUQTEFWPSPDPN
None
None
render(‘͜Μʹͪ’) ͜Μʹͪ <canvas> [0, 0, 0, 0, 0, 0, 0,
209, 0, …] ImageData
[0, 0, 0, 0, 0, 0, 0, 209, 0, 0,
0, 255, …] ImageData SFE HSFFO CMVF BMQIB
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, … ], … ]
पลͷGBMTFΛמΓऔΔ [ [f, f, f, f, f], [f, t, t,
t, f], [f, t, t, t, f], [f, f, f, f, f] ]
5SVFˠ˙ɹGBMTFˠ˘ [ [˘, ˘, ˘, ˘, ˘], [˘, ˙, ˙,
˙, ˘], [˘, ˙, ˙, ˙, ˘], [˘, ˘, ˘, ˘, ˘] ]
7JFXQPSUΛͣΒͯ͠Ξχϝʔγϣϯ DPOTPMFDMFBSˠDPOTPMFMPHˠʜ [ [˘, ˘, ˘, ˘, ˘], [˘, ˙,
˙, ˙, ˘], [˘, ˙, ˙, ˙, ˘], [˘, ˘, ˘, ˘, ˘] ]
ΧʔιϧͳΜͯͳ͍ͷͰ DPOTPMFDMFBSˠDPOTPMFMPHˠʜ
ʊਓਓਓਓʊ ʼɹɹʻ ʉ:?:?:?:ʉ
'JSFGPY $ISPNF 4BGBSJ
ͳ͔ͥ'JSFGPYͷEFWUPPMͷύϑΥʔϚϯε ͕܈Λൈ͍ͯྑ͍ DPOTPMFMPHͷୈೋҾʹελΠϧΛͤΔ console.log('%cfoo’, 'font-size: 10px;') DBOWBTʹେ͖Ίʹॻ͍͔ͯΒ খ͍͞αΠζͰDPOTPMFMPH͢Δͷ͕ྑ͍ײ͡ ݟ
࣍Τοδݕग़ʜʜʁ render(‘’)