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

How do you show
assets loading?

Avatar for yomotsu yomotsu
April 21, 2017
Technology
1
1k

How do you show
assets loading?

Avatar for yomotsu

yomotsu

April 21, 2017
Tweet

More Decks by yomotsu

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

Other Decks in Technology

See All in Technology
大規模サーバーレスプロジェクトのリアルな零れ話
Avatar for mai miya maimyyym
3
230
猫でもわかるS3 Tables【Apache Iceberg編】
Avatar for Hiroo Katoh kentapapa
2
220
とあるEdTechベンチャーのシステム構成こだわりN選 / edtech-system
Avatar for k.goto gotok365
5
350
計装を見直してアプリケーションパフォーマンスを改善させた話
Avatar for Kazuki Obata donkomura
1
130
20250514 1Passwordを使い倒す道場 vol.1
Avatar for Takumi Abe east_takumi
0
130
試作とデモンストレーション / Prototyping and Demonstrations
Avatar for Kenji Saito ks91
PRO
0
140
正式リリースされた Semantic Kernel の Agent Framework 全部紹介！
Avatar for Kazuki okazuki
1
1.2k
技術選定を突き詰める 懇親会LT
Avatar for Kaoru okaru
2
870
AIエージェントのオブザーバビリティについて
Avatar for Yunosuke Yamada yunosukey
0
270
"発信文化"をどうやって計測する？技術広報のKPI探索記/How do we measure communication culture?
Avatar for 株式会社ビットキー / Bitkey Inc. bitkey
4
320
既存の開発資産を活かしながら、 《新規開発コスト抑制》と《開発体験向上》 を両立する拡張アーキテクチャ事例
Avatar for kubell kubell_hr
0
240
Docker Compose で手軽に手元環境を実現する / Simplifying Local Environments with Docker Compose #CinemaDeLT
Avatar for nabeo nabeo
0
210

Featured

See All Featured
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
0
19
The Cult of Friendly URLs
Avatar for Andy Hume andyhume
78
6.4k
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
298
20k
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
PRO
19
1.2k
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
462
33k
RailsConf 2023
Avatar for Aaron Patterson tenderlove
30
1.1k
Learning to Love Humans: Emotional Interface Design
Avatar for Aarron Walter aarron
273
40k
Principles of Awesome APIs and How to Build Them.
Avatar for Keavy McMinn keavy
126
17k
Save Time (by Creating Custom Rails Generators)
Avatar for Garrett Dimon garrettdimon
PRO
31
1.2k
What’s in a name? Adding method to the madness
Avatar for Product Marketing Alliance productmarketing
PRO
22
3.4k
Bash Introduction
Avatar for André Augusto Costa Santos 62gerente
613
210k
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
378
70k

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