おえかきアプリを支える技術

UNTIL.LT 0x03（学生 LT 共催）＠筑波大学東京キャンパス 2023 / 12 /3 にて発表した、「おえかきアプリを支える技術」の登壇資料です。おえかきアプリ（https://itsu.dev/oekaki）の、特に独自画像圧縮技術にフォーカスした内容となっています。

Transcript

1. ͓͔͖͑ΞϓϦΛࢧ͑Δٕज़ શ୅ձ ৘ใॲཧਪਐಛผҕһձ ৘ใϝσΟΞ૑੒ֶྨ 
   ೥ ͪΎΔΓ @chururi_ @chururi_ #until_lt0x03 #ֶੜLT
2. ࣗݾ঺հ • ஜ೾େֶ ৘ใϝσΟΞ૑੒ֶྨ 
   ೥ • શ୅ձ ৘ใॲཧਪਐಛผҕһձ • ֶԂࡇ࣮ߦҕһձ ৘ใϝσΟΞγεςϜہʢKTZTʣ @chururi_ @itsu-dev @itsu_dev https://itsu.dev
3. ͓͔͖͑ΞϓϦͱ͸ • ࠓ೔ʢʣϦϦʔεͨ͠ݸਓ։ൃͷΞϓϦ • ஌Βͳ͍ਓͱڠྗͯ͠ 
   ຕͷֆΛॻ্͖͛Δʂ • ͞·͟·ͳϨΪϡϨʔγϣϯ •  ຕͷֆΛ࠷େ 
   ਓͰඳ͘ •  ච 
   ඵΛ 
   ච·Ͱ • ࢖͑Δͷ͸  ৭ͷϖϯ https://itsu.dev/oekaki
7. ٕज़ߏ੒ • ϑϩϯτΤϯυɿ/FYUKT • σϓϩΠ؀ڥɿ$MPVE'MBSF 1BHFT Imgur αϜωΠϧอଘ CloudFlare D1 ϝλσʔλอଘ CloudFlare R2 ඳըσʔλอଘ
8. ը૾อଘํࣜͷݕ౼ • ը૾ΛԿ౓΋্ॻ͖͢Δඞཁ • อଘ࣌ʹը૾͕ྼԽͯ͠͸ͳΒͳ͍
   ˠ +1&(
   ͰอଘෆՄ • ݩͷඳըσʔλΛ 
   ෮ݩ͍ͨ͠ ˠ +1&(
   ͰอଘෆՄ • ͳΔ΂͘ϑΝΠϧαΠζΛ࡟ݮ͍ͨ͠ ˠ 1/(
   ͰอଘෆՄ طଘͷอଘܗࣜ͸ෆ޲͖ ˠ ৽͍͠ѹॖΞϧΰϦζϜΛ࡞Ζ͏
9. ѹॖΞϧΰϦζϜʢʣ • 
   ৭ͷϖϯ ന৭ͷഎܠ  
   ৭Λѻ͏ 000 001 010 011 100 101 110 111 ˡ ֤৭͕ 3bit ͰදݱՄೳʂ • ը૾Λ 
   ࣍ݩϐΫηϧ഑ྻͱͯ͠ߟ͑ɺԣʹଓ͘ 
   ৭Λදݱ͢Δ 000 001 010 000 000 001 010 011 8bit = 1byte 8bit = 1byte 8bit = 1byte ˡ ԣʹଓ͘ 
   ৭Λ CZUF
   Ͱ දݱʂ ……..
10. ѹॖΞϧΰϦζϜʢʣ • ֤৭͕ԣʹଓ͘௕͞Λ࣍ͷόΠτྻʹଓ͚Δ 000 001 010 000 000 001 010 011 0, 0, 1 ˡ ന͸എܠͰΑ͘࢖ΘΕΔͷͰ 3byte Ͱɺଞ͸ 1byte Ͱදݱ ʢը૾͸ 300px ࢛ํݻఆʣ …….. 1 1 0, 0, 2 1 1 1 ৭σʔλ෦ʢ3byteʣ ௕͞σʔλ෦ʢ8 ~ 24byteʣ 1 νϟϯΫʢ11 ~ 27 byteʣ ˠ ͜ΕΛଓ͚͍ͯ͘
11. ѹॖΞϧΰϦζϜʢʣ ॎઢ͕ଟ͘ͳΔͱϑΝΠϧαΠζ͕େ͖͘ͳΔ ˠ ը૾Λԣʹඍ෼ͯ͠ѹॖํ޲ΛܾΊΔ ྡ͋ͬͨϐΫηϧΛ  ஋Խͯ͠ൺֱ͠ɺมԽ͕͋Ε͹Χ΢ϯτ͢Δ ˠ Χ΢ϯτ͕େ͖͚Ε͹ը૾Λԣ޲͖ʹͯ͠ѹॖ͢Δʂ ऑ఺
12. ݁Ռ ѹॖ͠ͳ͍৔߹ͱൺ΂ͯ ࠷େ ໿ 
     ͷσʔλྔ࡟ݮʹ੒ޭʂ 3
    ্ʹอଘ͞Ε͍ͯΔը૾σʔλͨͪ ˠ ˞
    +4
    ϥΠϒϥϦͰ͋Δ QBLP Λ༻͍ͨ࠶ѹॖࠐΈ 🎉 🎉