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

パフォーマンス向上のための画像最適化

Avatar for akiynkmr akiynkmr
July 05, 2016
Design
0
230

 パフォーマンス向上のための画像最適化

社内の勉強会資料です。弊社のWebサイトのパフォーマンス向上のために行った施策をまとめました。

Avatar for akiynkmr

akiynkmr

July 05, 2016
Tweet

Other Decks in Design

See All in Design
【pmconf2025】PdMの頭の中を見える化する体験構造図
Avatar for Shigeyuki Kameda kamechi7222222
1
1.9k
爆速開発でAIプロダクトが40万インプレッションになった話
Avatar for つぶら tsubura
0
160
デザイナーとエンジニアで 同じ山に登ろう
Avatar for moco moco1013
0
140
From the Visible Crossroads: Turning Outputs into Outcomes
Avatar for takai_kanako takaikanako
2
1.1k
TUNAG BOOK 2024
Avatar for 株式会社スタメン stmn
PRO
0
1.4k
デザインを信じていますか
Avatar for sekig(ojiee) sekiguchiy
1
960
Vibe Coding デザインシステム
Avatar for poteboy poteboy
3
1.7k
TWCP#21 UXデザインと哲学のはなし
Avatar for MAMIYA Shinsuke shinn
0
270
モビリティプラットフォームの未来を築くクラウド基盤
Avatar for Hajime KOSHIRO kossykinto
0
210
生成AIの不確実性を価値に変える、「ビズリーチ」の体験設計 / KNOTS2026
Avatar for Visional Engineering ＆ Design visional_engineering_and_design
4
710
Goodpatch Tour💙 / We are hiring!
Avatar for Goodpatch Inc. goodpatch
31
1M
AIでデザインをつくる：基礎編
Avatar for 太田賢一 kenichiota0711
3
2.5k

Featured

See All Featured
A better future with KSS
Avatar for Kyle Neath kneath
240
18k
Documentation Writing (for coders)
Avatar for Carmen Chung carmenintech
77
5.3k
The MySQL Ecosystem @ GitHub 2015
Avatar for Sam Lambert samlambert
251
13k
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
302
51k
Balancing Empowerment & Direction
Avatar for Lara Hogan lara
5
900
HDC tutorial
Avatar for Michiel Stock michielstock
1
400
AI Search:
Where Are We & What Can We Do About It?
Avatar for Aleyda Solis aleyda
0
7k
For a Future-Friendly Web
Avatar for Brad Frost brad_frost
182
10k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
85
9.4k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
240
Practical Tips for Bootstrapping Information Extraction Pipelines
Avatar for Matthew Honnibal honnibal
25
1.7k
Avoiding the “Bad Training, Faster” Trap in the Age of AI
Avatar for Mike Taylor tmiket
0
79

Transcript

  1. ύϑΥʔϚϯε޲্ͷ ͨΊͷը૾࠷దԽ ʙϢʔβʔʹΑΓྑ͍69Λఏڙ͢ΔͨΊʹʙ $SFWPגࣜձࣾ ϓϩσϡʔαʔதଜߊ೭

  2. ࢀߟࢿྉ

  3. औΓ૊ΜͩܦҢ w ϦχϡʔΞϧͨ͠ϖʔδ͕ը૾Λଟ༻͍ͯͯ͠ ύϑΥʔϚϯεྑ͘ͳ͔ͬͨ w ը໘ඳը͕஗͍ͱϢʔβʔ཭୤ͪ͠Ό͏   w αΠτධՁྑ͘ͳ͍ͱ4&0ॱҐམͪΔ

  4. औ૊Έલ 1BHF4QFFE*OTJHIUT IUUQT EFWFMPQFSTHPPHMFDPNTQFFEQBHFTQFFEJOTJHIUT  w 1$൛̏఺ w ϞόΠϧ൛఺

  5. औ૊Έલ 8FCQBHFTU IUUQXXXXFCQBHFUFTUPSH

  6. Ξʔϝϯʜ0.(

  7. ը૾ͷσϝϦοτ w ϑΝΠϧαΠζ͕େ͖͍ w ϦΫΤετ͕૿͑Δ

  8. ը૾ͷσϝϦοτ w ϦΫΤετ͕૿͑Δ ը૾ͷຕ਺෼ɺαʔόʔଆʹϦΫΤετ͢Δ⇢

  9. w ϑΝΠϧαΠζ͕େ͖͍ ⇢ը૾ͷ࠷దԽ w ϦΫΤετ͕૿͑Δ ⇢$44εϓϥΠτɺ47(ͷ׆༻ ɹը૾ͷ$44ԽͰϦΫΤετΛݮΒ͢ औΓ͏ΔରԠࡦ

  10. ը૾ͷ࠷దԽ

  11. ը૾͝ͱʹద੾ͳαΠζɺѹॖํࣜɺϑΝΠϧܗࣜɺը࣭Λ બఆ͢Δ ͨͩ͠ɺ$SFWP͸ಈըͷߴ඼࣭͕ചΓɻ࡞඼ͷѱ͘ݟ͑ͳ͍ Α͏ஶ͍͠ը࣭ͷྼԽʹ͸஫ҙ͢ΔɻσβΠϯͱͷόϥϯε ௒େࣄɻ ը૾ͷௐ੔ 1/( º ը࣭ྼԽͳ͠,# +1&( º ը࣭ˋ,#

  12. *NBHF0QUJN w ՄٯѹॖํࣜͰˋ ඼࣭ͷ··ద੾ͳѹॖ ํࣜΛબΜͰѹॖ w ඇՄٯѹॖํࣜͰը࣭ Λௐ੔͢Δ͜ͱ΋Ͱ͖ Δ Ͳ͏΍ͬͯ

  13. ϕʔεϥΠϯ+1&(Ͱ͸ͳ͘ɺϓϩάϨογϒ+1&(ͷ׆༻ Λݕ౼͢Δ Ϣʔβʔͷମײ଎౓޲্ʹܨ͕Δ ϓϩάϨογϒ+1&(ͷ׆༻ ࠷ॳʹ΅Μ΍Γͱશମ૾͕ݱΕɺ ࣍ୈʹ઱໌Խ͍ͯ͘͠ ϓϩάϨογϒ+1&( ্͔ΒঃʑʹಡΈࠐΜͰදࣔ͢Δ Ұൠతͳํࣜ ϕʔεϥΠϯ+1&(

  14. w ϓϩάϨογϒ+1&(͸Ͳͷϒϥ΢βͰ΋දࣔ͞ΕΔ͕ɺ ϓϩάϨογϒදࣔʹରԠ͍ͯ͠ͳ͍ϒϥ΢βͰ͸μ΢ϯ ϩʔυΛ׬શʹऴ͑ͨޙʹදࣔ͞ΕΔͨΊɺରԠ͍ͯ͠Δ ϒϥ΢βΑΓ΋Ώͬ͘Γͱදࣔ͞ΕΔ w ϓϩάϨογϒ+1&(ΛಡΈࠐΉʹ͸ͦΕͧΕͷը૾ʹର ͠ɺϕʔεϥΠϯ+1&(ͰαΠτ಺ͷશը૾Λϖʔδʹදࣔ ͢Δͷͱಉ౳ͷ$16ύϫʔ͕ඞཁɻϞόΠϧͰͷද͕ࣔݒ ೦͞ΕΔɻ

    ϓϩάϨογϒ+1&(ͷ஫ҙ఺

  15. ϦΫΤετͷ࡟ݮ

  16. ෳ਺ͷը૾Λͭͷը૾ʹͯ͠ɺϦΫΤετΛճʹ͠ɺ $44Ͱը૾ΛεϥΠεͯ͠ɺॲཧΛهࡌ͢Δɻ ͨͩ͠ɺը૾ͷߋ৽͢Δͱ$44΋ߋ৽͠ͳ͖Ό͍͚ͳ͍ $44εϓϥΠτͷ׆༻

  17. $44ͰදݱͰ͖Δ΋ͷ͸$44Ͱॻ͘ ը૾Λ࢖Θͳ͍ͨΊɺϦΫΤετ͕ൃੜ͠ͳ͍͏͑ɺը૾ ΑΓܰ͘ͳΔͨΊɺͳΔ΂࣮͘ࢪͨ͠΄͏͕ྑ͍ɻ ը૾⇢$44Խ

  18. ൪֎ฤ

  19. ⒎NQFHͰϏοτϨʔτΛௐ੔͠ɺ$44Ͱഎܠʹࠇಁա͠ ͨບͰ෴͍ը࣭ͷྼԽΛ͝·͔͍ͯ͠Δ ಈը͸ը࣭Λམͱͯ͠഑৴ .1 º LCT.# .1 º LCT.#

  20. ը૾ͷ࠷దԽͷΈ औ૊Έޙ 1BHF4QFFE*OTJHIUT IUUQT EFWFMPQFSTHPPHMFDPNTQFFEQBHFTQFFEJOTJHIUT  w 1$൛̏఺ɹ⇢ɹ఺ w ϞόΠϧ൛఺ɹ⇢ɹ఺

  21. 8FCQBHFTU IUUQXXXXFCQBHFUFTUPSH ը૾ͷ࠷దԽͷΈ औ૊Έޙ

  22. ࠓޙͷऔ૊Έ w ϕʔεϥΠϯ+1&(⇢ϓϩάϨογϒ+1&( w ը૾⇢$44Խ w ద੾ͳΩϟογϡར༻ w +BWB4DSJQUͷಡΈࠐΈॱ൪ͷௐ੔ w

    ಈըΞοϓϩʔυ࣌ʹαϜωΠϧࣗಈϦαΠζˍѹॖ w ಈը͸.1⇢8FC.

  23. 8FCαΠτʹΑΓྑ͍69Λ