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

How do you show
assets loading?

yomotsu
April 21, 2017
Technology
1
980

How do you show
assets loading?

yomotsu

April 21, 2017
Tweet

More Decks by yomotsu

See All by yomotsu
three.jsとRapierでレースゲームが3日でできた話
yomotsu
0
450
PBR in three.js
yomotsu
1
850
dialog要素でつくるモーダルダイアログ
yomotsu
0
970
IE to Edge
yomotsu
1
330
A Camera Control Library for three.js
yomotsu
1
1.2k
Let’s try AR
 on mobile Web with <model-viewer>
yomotsu
0
530
WebXR: Beyond
 WebGL
yomotsu
2
1.7k
Non-DOM components with WebGL in Vue.js
yomotsu
5
12k
WebGL Libs for
 WebApp Frameworks
yomotsu
4
7.8k

Other Decks in Technology

See All in Technology
2/18/25: Java meets AI: Build LLM-Powered Apps with LangChain4j
edeandrea
PRO
0
120
リアルタイム分析データベースで実現する SQLベースのオブザーバビリティ
mikimatsumoto
0
1.4k
データマネジメントのトレードオフに立ち向かう
ikkimiyazaki
6
980
Larkご案内資料
customercloud
PRO
0
650
Classmethod AI Talks(CATs) #16 司会進行スライド(2025.02.12) / classmethod-ai-talks-aka-cats_moderator-slides_vol16_2025-02-12
shinyaa31
0
110
開発スピードは上がっている…品質はどうする？ スピードと品質を両立させるためのプロダクト開発の進め方とは #DevSumi #DevSumiB / Agile And Quality
nihonbuson
2
3k
ハッキングの世界に迫る～攻撃者の思考で考えるセキュリティ～
nomizone
13
5.2k
Amazon S3 Tablesと外部分析基盤連携について / Amazon S3 Tables and External Data Analytics Platform
nttcom
0
130
エンジニアのためのドキュメント力基礎講座〜構造化思考から始めよう〜（2025/02/15jbug広島#15発表資料）
yasuoyasuo
17
6.8k
あれは良かった、あれは苦労したB2B2C型SaaSの新規開発におけるCloud Spanner
hirohito1108
2
600
モノレポ開発のエラー、誰が見る？Datadog で実現する適切なトリアージとエスカレーション
biwashi
6
810
開発組織のための セキュアコーディング研修の始め方
flatt_security
3
2.4k

Featured

See All Featured
Writing Fast Ruby
sferik
628
61k
Bash Introduction
62gerente
611
210k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Navigating Team Friction
lara
183
15k
Building Your Own Lightsaber
phodgson
104
6.2k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.5k
Stop Working from a Prison Cell
hatefulcrawdad
267
20k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
9
440
Optimising Largest Contentful Paint
csswizardry
34
3.1k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
174
51k
The Invisible Side of Design
smashingmag
299
50k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
193
16k

Transcript

  1. How do you show
 assets loading? Presented by Akihiro Oyamada

    (@yomotsu) Apr 21, 2017

  2. Frontend Engineer at PixelGrid, Inc. Akihiro Oyamada @yomotsu

  3. None

  4. • ϩʔυ͍ͯ͠Δͷ͸Θ͔Δ • ͍ͭऴΘΔͷ͔͸Θ͔Βͳ͍ εϐφʔ

  5. http://www.createjs.com/preloadjs

  6. • ϩʔυਐߦ౓͕Θ͔Δ • ϩʔυਐߦ౓͸ϦχΞͰ͸ͳ͍ • ϑΝΠϧϔομ͸ϑΝΠϧ਺෼ Preload.js

  7. None

  8. • ϑΝΠϧϔομ͸1ͭʢϑΝΠϧ͕݁߹͞Ε͍ͯΔʣ • XHR2Ͱϩʔυਐߦ౓΋औΕΔ(ϦχΞ) • ѹॖ͕ޮ͘ zip

  9. http://yomotsu.net/blog/assets/2016-12-25-xmas/

  10. 3D Model file consists of mostly numbers

  11. 3D scanned(ish) Model file

  12. http://localhost:8000/5_compress/bad.html

  13. None

  14. Save 70% of size!

  15. Can JS extract zip files? 15

  16. There is a library!
 called zip-loader.js 16

  17. https://www.npmjs.com/package/zip-loader

  18. demo https://www.npmjs.com/package/zip-loader

  19. gl.finish(); @yomotsu