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
300
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
960
Vue の TypeScript 事情
ktsn
1
2.6k

Other Decks in Programming

See All in Programming
AIの力でお手軽Chrome拡張機能作り
taiseiue
0
190
Bedrock Agentsレスポンス解析によるAgentのOps
licux
3
920
機能が複雑化しても 頼りになる FactoryBotの話
tamikof
0
140
React 19アップデートのために必要なこと
uhyo
8
1.5k
XStateを用いた堅牢なReact Components設計~複雑なClient Stateをシンプルに~ @React Tokyo ミートアップ #2
kfurusho
1
990
苦しいTiDBへの移行を乗り越えて快適な運用を目指す
leveragestech
0
1k
Jasprが凄い話
hyshu
0
160
新宿駅構内を三人称視点で探索してみる
satoshi7190
2
120
Honoをフロントエンドで使う 3つのやり方
yusukebe
7
3.5k
『テスト書いた方が開発が早いじゃん』を解き明かす #phpcon_nagoya
o0h
PRO
8
2.4k
pylint custom ruleで始めるレビュー自動化
shogoujiie
0
150
2025.2.14_Developers Summit 2025_登壇資料
0101unite
0
190

Featured

See All Featured
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
10
1.3k
A better future with KSS
kneath
238
17k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
356
29k
Bootstrapping a Software Product
garrettdimon
PRO
306
110k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
226
22k
Evolution of real-time – Irina Nazarova, EuRuKo, 2024
irinanazarova
6
570
Fantastic passwords and where to find them - at NoRuKo
philnash
51
3k
Code Review Best Practice
trishagee
67
18k
Building Applications with DynamoDB
mza
93
6.2k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
10
510
A Modern Web Designer's Workflow
chriscoyier
693
190k

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(‘’)