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
690
PBR in three.js
Avatar for yomotsu yomotsu
1
960
dialog要素でつくるモーダルダイアログ
Avatar for yomotsu yomotsu
0
1k
IE to Edge
Avatar for yomotsu yomotsu
1
360
A Camera Control Library for three.js
Avatar for yomotsu yomotsu
1
1.3k
Let’s try AR
 on mobile Web with <model-viewer>
Avatar for yomotsu yomotsu
0
560
WebXR: Beyond
 WebGL
Avatar for yomotsu yomotsu
2
1.9k
Non-DOM components with WebGL in Vue.js
Avatar for yomotsu yomotsu
5
13k
WebGL Libs for
 WebApp Frameworks
Avatar for yomotsu yomotsu
4
7.8k

Other Decks in Technology

See All in Technology
混合雲環境整合異質工作流程工具運行關鍵業務 Job 的經驗分享
Avatar for Yao-Siang Su (蘇曜祥) yaosiang
0
180
オブザーバビリティが育むシステム理解と好奇心
Avatar for maru maruloop
2
1k
ヘンリー会社紹介資料（エンジニア向け） / company deck for engineer
Avatar for Henry, Inc. henryofficial
0
360
事業開発におけるDify活用事例
Avatar for KentaroFujii kentarofujii
5
1.4k
物体検出モデルでシイタケの収穫時期を自動判定してみた。 #devio2025
Avatar for Lamaglama39 lamaglama39
0
280
From Natural Language to K8s Operations: The MCP Architecture and Practice of kubectl-ai
Avatar for Bo-Yi Wu appleboy
0
200
SCONE - 動画配信の帯域を最適化する新プロトコル
Avatar for kazuho kazuho
1
370
【SORACOM UG Explorer 2025】さらなる10年へ ～ SORACOM MVC 発表
Avatar for SORACOM soracom
PRO
0
130
Okta Identity Governanceで実現する最小権限の原則 / Implementing the Principle of Least Privilege with Okta Identity Governance
Avatar for Tatsumi Nishikawa tatsumin39
0
170
AI AgentをLangflowでサクッと作って、1日働かせてみた！
Avatar for Yano-13 yano13
1
150
生成AI時代のPythonセキュリティとガバナンス
Avatar for abenben abenben
0
130
ソースを読む時の思考プロセスの例-MkDocs
Avatar for Satoru Takeuchi sat
PRO
1
170

Featured

See All Featured
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
Avatar for Stéphanie Walter stephaniewalter
285
14k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
52
3.5k
Gamification - CAS2011
Avatar for David Bonilla davidbonilla
81
5.5k
Optimizing for Happiness
Avatar for Tom Preston-Werner mojombo
379
70k
The Straight Up "How To Draw Better" Workshop
Avatar for Dennis Kardys denniskardys
238
140k
JavaScript: Past, Present, and Future - NDC Porto 2020
Avatar for David Neal reverentgeek
52
5.7k
Raft: Consensus for Rubyists
Avatar for Patrick Van Stee vanstee
140
7.2k
Automating Front-end Workflow
Avatar for Addy Osmani addyosmani
1371
200k
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
272
21k
A Tale of Four Properties
Avatar for Chris Coyier chriscoyier
161
23k
Docker and Python
Avatar for Tania Allard trallard
46
3.6k
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
359
30k

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