レガシーな実装を丁寧にリファクタしモダンな実装にする技術【DeNA TechCon 2022 Autumn】

You Tube：https://youtu.be/1C_1equH8a4

概要：
ライブ配信において、動画の中で動作するアイテム動画は、ライブ配信を行うライバーとその配信をみるリスナーをつなぐ大事なコミュニケーション手段です。

このアイテム動画のエフェクト画質は高いほうが良いものの、エフェクト画質が高いとリスナーのもつデバイスの高い処理性能を必要とします。そのため、エフェクト画質とデバイスのパフォーマンスはトレードオフになるなかで、いかに企画要件を満たしたエフェクト画質を実現しつつもパフォーマンスを良くしていくかが肝になってきます。

本発表では、どのようにアイテム動画再生パフォーマンス改善に取り組んでいるのかをご紹介します。

登壇内でのリンク集：
p12, http://wiki.webmproject.org/alpha-channel
p20-1, https://github.com/DeNA/HEVCPlayerView
p20-2, https://engineering.dena.com/blog/2022/07/hevcplayerview
p25-1, https://speakerdeck.com/noppefoxwolf/raibupei-xin-apurifalseaitemuzai-sheng-wometaldeshi-zhuang-surushi-ninatutahua
p25-2, https://developer.apple.com/videos/play/wwdc2019/506/
p25-3, https://developer.apple.com/av-foundation/HEVC-Video-with-Alpha-Interoperability-Profile.pdf

◆ チャンネル登録はこちら↓
https://youtube.com/c/denatech?sub_confirmation=1

◆ Twitter
https://twitter.com/DeNAxTech

◆ DeNA Engineering
https://engineering.dena.com/

◆ DeNA Engineer Blog
https://engineering.dena.com/blog/

◆ DeNA TechCon 2022 Autumn 公式サイト
https://techcon2022.dena.dev/autumn/

Transcript

1. Ȼ
   ḄᶚḖᵩᷟאᓙṋÿ׶ᷥḇᶰᵺ᷋ḟḕḡ
   ᷗᶈᷝᷟאᓙᷥḛḌࢇᒯ
   ࡵӓ߅Ԝᯔᰦ<Œ‹\ᰦ/i‹‰Œx\ᰦᯕ
   

   View Slide

2. ȼ
   ȼ
   ᭅᮩ ዎڠᅏś
   Ɣ ᭆ᭄ᭅ᭍ۏiĕᜅɚ࿧᯸Ḙᷨݗ}dqyq‹˜ᰦ/iep{}y}oqi‰᯹
   ż ḟ᷋Ḗᵩᵶ᷿ḇᯠ!5ᯡḧᯠ!ᯡᷨħ̅Ϣᵶ᷿ḇ
   ż ḟ᷋ḖᵩᶰᵩᶎᶊḇᵾḇᵩḐᵩᶂḜᯠ!ᰦq{iᯡ
   Ɣ ᭆ᭄ᭆᭅۏ
   ż ᯦ᶢḁᷝᶆḍᵩᶰᵺᷝḟṫᵩᯧࣸԻᶆḁḳṧᯠ-x˜i\…ᰦn}ˆᰦ{gˆ}qgᯡ
   

   View Slide

3. Ƚ
   Ƚ
   ᭆᮩ ᶣṪ᷐ᷥ
   ᷓᷟḏᷜᰝḇᶰᵺ᷋ḟḇᷝᶢᶣᶉ᷄ḡᶲ᷍ḛᶺᯈ
   

   View Slide

4. Ⱦ
   Ⱦ
   ᭆᮩ ᶣṪ᷐ᷥ
   ୽ኀᡮ༥ṎĆɥΒǑ௅ᶙṮḭḧᅲᶲḡᰝḘᷜᷟᶪ᷎ᶙᷟᶲᯄ
   ᷿Ḋᶈ᷋Ḩᷯᵩᷠᵩᷨ๗ᔯṋݜḀḃᷟᶲᯄ
   ḇᶰᵺ᷋ḟḇᷝᶢᶉছḞᷥĆɥΒṋʧḛᷨᶙއᶲᯄ
   

   View Slide

5. ȿ
   ȿ
   ªf.ɵxpª.pª¡
   ᭅᮩ ዎڠᅏś
   ᭆᮩ ᶣṪ᷐ᷥ
   ᭇᮩ -x˜i\…ᷨᅏś
   ᭈᮩ ᔯఞḕḞᶺḭḞ-x˜i\…ᷨᖁᥥ
   ᭉᮩ ḇᶰᵺ᷋ḟḇᷝᶢᷨąೠȒ
   \ᮩ ⮬㌟䛾䝥䝻䝆䜵䜽䝖䜢▱䜛
   dᮩ ᩛ䠄䝁䞊䝗䠅䛸࿡᪉䠄䝏䞊䝮䝯䞁䝞䞊䠅䜢▱䜛
   ᭊᮩ -x˜i\…ᷨḇᶰᵺ᷋ḟḇᷝᶢᅜ੯
   ᭋᮩ ÿ׶ᷥḇᶰᵺ᷋ḟḇᷝᶢḛḌḞ᷐ᷨ/q…‰
   

   View Slide

6. ɀ
   ɀ
   ᭇᮩ -x˜i\…ᷨᅏś
   Ɣ ᯦ᶢḁᷝᶆḍᵩᶰᵺᷝḟṫᵩᯧṋ
   ݺ᜷᷿ᷥḄᶳᶉ᷄Ḍᶆḁḳṧ
   ż ᷋ᶳḯ᷋ᵶ᷋ḓḜ
   ż /}}ḇḜḨ
   ż ᭆັᤞʭ˚
   Ɣ ᭆ᭄ᭅ᭍ۏᭌਨᭇযᷥḇḇᵩḜ
   

   View Slide

7. Ɂ
   Ɂ
   ᭈᮩ ᔯఞḕḞᶺḭḞ-x˜i\…ᷨᖁᥥ
   

   View Slide

8. ɂ
   ɂ
   Ɍᶬᶍᷨ-x˜i\…
   Ɣ ᶢḁᶆḍṋݺ᜷᷿ᷥḄᶳᶉ᷄Ḍᶆḁḳṧ
   ż ᷋ᶳḯ᷋ᵶ᷋ḓḜ
   ż /}}ḇḜḨ
   ż ᭆັᤞʭ˚
   Ɣ ᭆ᭄ᭅ᭍ۏᭌਨᭇযᷥḇḇᵩḜ
   

   View Slide

9. Ⱥȹ
   Ⱥȹ
   ḇ᷽ṫḨḇƙ࡙ᶣᭆ᭄ᭅ᭍ۏᭊਨᭋয
   ḇ᷽ṫḨḇƙ࡙ᰆḇḇᵩḜ᷍ᶉᭆ᷂ਨܩᯄ
   

   View Slide

10. ȺȺ
    ȺȺ
    Ɣ 0ḜḄḯᶎᶉᵶ᷋ḓḜḏḃḌᶰᵺᶳḍṎ
    ż ᵾᶳᷠḇᶊᵩḟ᷷ᷨᵩḜᷖᮭ
    Ɣ ᶰḍ\‘\ᶉᡮ༥ḏḃᰝௗḆᅲᶿḌ\‘\᷈ᵩᶎ
    Ɣ ฎዎᷨʛ๗ḧᰝ\‘\᷈ᵩᶎḧ}‹yq{ᷨಥѿᶉŒyyᰀ0{‰\ni‹˜
    Ɣ ඎॿᷥͪඟḏḃᰝᵵḤ᷇ḤᶺḀਛছḏḃḌ,—
    Ɣ ḘᷖḘᷖƤᶲঝᶙᡲᜫḭḡᶲḌ,—
    ࢇᒯ༭ᗾșᷖԕᶲ
    

    View Slide

11. ȺȻ
    ȺȻ
    Ɣ ᭆ᭄ᭅ᭍ۏᡮ༥ᡮ՛ᶉᶰḍ\‘\ᶉᡮ༥ḏḃḡᶲḌ
    ż ܷ৙\‘\ᶙě˨ᷨ᷑ᷝᵾᵩ
    ż ʻ຦ṋĵ׌ḕḡᶲḞ\‘\ḁᶳᶆḁḇḧ}‹yq{ᶉʻ຦ḛḌଇᕏ৙ᡲᶙඎᶺḭḞ
    Ɣ -x˜i\…ᷥw}q{ḕḞḧ᷄ᷥᶣᭉ˚ᶬᶍ}‹yq{̣ḏḃḡᶲḞ
    Ɣ ௗḆᅲᶿḌᰦᰍ᷐ᷜᶍ᷊ḏᶲᰎᰦḧ᷇ḉᷨ}‹yq{̣
    ż ݇᥉჌ѩᶙۛḛᶝḌḧ᷇ḉ
    ż ݇᥉ḕḞӅΒᷨᶳ᷷ᷝ᷋ḨᶙԚ᷄ḛᶝḌ᝞ʭ
    Ɣ ᶍḲḒḇᶰᵺ᷋ḟḇᷝᶢḛḌᷟḀᶊᶰᵺ᷋ḨḜḟᷝᶈᵩᶎṋƤᶲḞᶲ
    ż
    }ˆ}Œ‹q{iṎy}’
    ᷟᷥᶣḧᷖᵵḃ}‹yq{ᶙறḕᶲ
    

    View Slide

12. Ⱥȼ
    Ⱥȼ
    ᭉᮩ ḇᶰᵺ᷋ḟḇᷝᶢᷨąೠȒ
    

    View Slide

13. ȺȽ
    ȺȽ
    Ɣ ḇḜ᷋ᕈםۦṋ࿈ᕯḛḌ
    ż ḇᶰᵺ᷋ḟḇᷝᶢᶙЁᥥṋܜ᷄ᙉ᷇ḛΆኀސṋሪࠝḛḌ
    Ŷ œṎ̂෪ᷟᶍᷨຢπṎȃ۬ᶦᷨ݇᥉
    Ŷ šሬᷨᗿຣ᯸ᶊᵩḟᘚຣᷖ΢ᷙ᯹ᶦᷨ݇᥉
    Ŷ ዎ࿧ᷨʻ཈ᶦᷨ݇᥉
    ዎᚑ᷿ᷨḊṫᶖ᷋ḨṋྖḌ
    ḇᶰᵺ᷋ḟḇᷝᶢṋᰦᰍḛḌᰎᰦḇḜ᷋ḧ
    ḇᶰᵺ᷋ḟḇᷝᶢṋᰦᰍḕᷟᶲᰎᰦḇḜ᷋ṋᶉ᷄Ḍᶇᶿ௅࿈ᷥᕗƵḛḌ
    

    View Slide

14. ȺȾ
    ȺȾ
    Ɣ ḇᶰᵺ᷋ḟḇᷝᶢᷨរᔑސᷨɢᜊᕯᗃṋƙḌ
    ż -x˜i\…ᷨḥᵩᷚᷥᶣɢᜊᕯᗃᶙᵵḭḞ
    Ŷ ḥᵩᷚᷥᶣᷖḤḉᷜ)!ᷖ΢᷍ḃḌ
    Ŷ ᷇ᷨɢᜊᕯᗃᶙඎᶲӅΒᶣƙḌḧ᷇ḉᶺḀݮᔑ
    Ɣ ᡮ༥ᜍۦᷨƎą
    Ɣ ᷿Ḋᶈ᷋ḨϛᘪᷨƎą
    Ɣ ᷿Ḋᶈ᷋Ḩᷨ؃πᷨƎą
    Ɣ زœ̣ᷨ˫ᜍ
    Ɣ ᡮ༥ሬᷨᷗḥᶀᵩḖṛᷝᷨƎą᯸᛹቏ḇḜ᷋᯹
    κঝᯔḥᵩᷚ᷑ᷝᵾᵩᯕṋྖḌ
    

    View Slide

15. Ⱥȿ
    Ⱥȿ
    ḇᶰᵺ᷋ḟḇᷝᶢᷨរᔑސᷨɢᜊᕯᗃṋƙḌ
    κঝᯔḥᵩᷚ᷑ᷝᵾᵩᯕṋྖḌ
    

    View Slide

16. Ⱥɀ
    Ⱥɀ
    Ɣ ḇᶰᵺ᷋ḟḇᷝᶢᷨរᔑސᷨɢᜊᕯᗃṋƙḌ
    ż -x˜i\…ᷨḥᵩᷚᷥᶣɢᜊᕯᗃᶙᵵḭḞ
    Ŷ ḥᵩᷚᷥᶣᷖḤḉᷜ)!ᷖ΢᷍ḃḌ
    Ŷ ᷇ᷨɢᜊᕯᗃᶙඎᶲӅΒᶣƙḌḧ᷇ḉᶺḀݮᔑ
    Ɣ ᡮ༥ᜍۦᷨƎą
    Ɣ ᷿Ḋᶈ᷋ḨϛᘪᷨƎą
    Ɣ ᷿Ḋᶈ᷋Ḩᷨ؃πᷨƎą
    Ɣ زœ̣ᷨ˫ᜍ
    κঝᯔḥᵩᷚ᷑ᷝᵾᵩᯕṋྖḌ
    

    View Slide

17. ȺɁ
    ȺɁ
    Ɣ ḇᶰᵺ᷋ḟḇᷝᶢᷨរᔑސᷨɢᜊᕯᗃṋƙḌ
    ż -x˜i\…ᷨḥᵩᷚᷥᶣɢᜊᕯᗃᶙᵵḭḞ
    Ŷ ḥᵩᷚᷥᶣᷖḤḉᷜ)!ᷖ΢᷍ḃḌ
    Ŷ ᷇ᷨɢᜊᕯᗃᶙඎᶲӅΒᶣƙḌḧ᷇ḉᶺḀݮᔑ
    Ɣ ᡮ༥ᜍۦᷨƎą
    Ɣ ᷿Ḋᶈ᷋ḨϛᘪᷨƎą
    Ɣ ᷿Ḋᶈ᷋Ḩᷨ؃πᷨƎą
    Ɣ زœ̣ᷨ˫ᜍ
    Ɣ ᡮ༥ሬᷨᷗḥᶀᵩḖṛᷝᷨƎą᯸᛹቏ḇḜ᷋᯹
    κঝᯔḥᵩᷚ᷑ᷝᵾᵩᯕṋྖḌ
    ⛥䛻䜘䛟ぢⴠ䛸䛥䜜䜛䈊
    

    View Slide

18. Ⱥɂ
    Ⱥɂ
    Ɣ ḇᶰᵺ᷋ḟḇᷝᶢᶙᰦᰍĆ׃ᰎᰦᷟᷨᶣᰝϛᘪᷨࢢNjᷥዎǍᶙඎᶲᶺḀ
    ż ؂ᗪᷨḢḜḨ᷈ᵩᶎ᯸ḢḜḨ᷀ᵩḜ᯹ṋ຦ߵḛḌ
    Ŷ ḇᶰᵺ᷋ḟḇᷝᶢ཰ࡵˌᷥঁᶑḡ᷊ᷮᷨᷖጂᶲ
    Ɣ ḇᶰᵺ᷋ḟḇᷝᶢ؂ᗪᶣᅋᶺ᷊ḥ᷀ḯḨṋʮḭḡჄ๗ḛḌ
    ż Ʃ᯹/q‹yi᮫ᰦ—\z…yi,i…}‰q‹}ˆ˜ṋ}‹yq{̣ḛḌ
    Ŷ ṎḌ᷇ḧ
    Ɣ —\z…yi,i…}‰q‹}ˆ˜ᷨḢḜḨ᷈ᵩᶎṋਞ᷊
    ż ᶉ᷄ḃᵽݮᔑᷟḢḜḨ᷀ᵩḜᷖਞ᷊
    Ɣ ᶉዎ̂ԌऌḛḌ
    Ɣ ዎ̂ԌऌḏḃḞ᷈ᵩᶎṋਦ᜷̣ḛḌ
    Ɣ ḢḜḨ᷈ᵩᶎᶙ)\‰‰ḛḌ᷇ḧṋ࿈ᕯḛḌ
    Ŷ }{iᷨ੔Ű
    Ɣ ᯠṎḌ᷇ḧᯡׅᷨĴ
    Ɣ ),᷎ᷨᵩṫ
    ংᯔ᷈ᵩᶎᯕṋྖḌ
    

    View Slide

19. Ȼȹ
    Ȼȹ
    ᷿ḁᷝᷦᷝᶢ
    Ɣ ḇḜ᷋ᕈםۦᰝᶂṫᷣḜ᷿ḁᷝᰝ݇᥉჌ѩᷟᶍᶺḀ᷿ḁᷝᷦᷝᶢ
    ż ݇᥉჌ѩᶙؐḏᶲᷖᷨᶣᔷັ༭ᷥ᥎மאট
    Ɣ ݇᥉჌ѩᶙԚ᷄ᶲᷖᷨᶣ᷈ᷝᶰḇ᷋ḨṋᝃᶿḌḞ᷐ᰝšᷨƙତṋþ৙༭ᷥ௄᷐Ḟᶲ
    Ŷ ܷᕥḇᶰᵺ᷋ḟḇᷝᶢਵᡲᷨḇḇᵩḜḜ᷀ṫṣᵩḍṋᖅঁ
    Ŷ Ԛ᷊᷄᷈ᷝᶰḇ᷋ḨḛḌḧᰝḘᷨᔯ౽ḛḀĆɥΒṋοᶅ
    Ɣ ḇᶰᵺ᷋ḟḇᷝᶢݗᷨ+ḧḇḇᵩḜᔷັ
    ż ݇᥉჌ѩᰝ+ਵᡲᰝḇḇᵩḜḟᶳᷔᷝᶢ
    

    View Slide

20. ȻȺ
    ȻȺ
    ᭊᮩ -x˜i\…ᷨḇᶰᵺ᷋ḟḇᷝᶢᅜ੯
    

    View Slide

21. ȻȻ
    ȻȻ
    }‹yq{̣
    Ɣ }‹yq{̣ᷨఞݭ
    ż ᭆ᭄ᭆ᭄ᮩᭅᮩᭇ᭄ᷥ}Ḑᶳᷝ
    Ɣ ୽ኀᡮ༥ḧĒᒬḕḡᷨ}‹yq{̣
    ż ᭆ᭄ᭆ᭄ۏąਵᰆᭆ᭄ᭆᭅąਵ
    ż ěᷥฎၫḕḞ
    y\‰‰̈́ƍᶉḇᶰᵺ᷋ḟḇᷝᶢᶉ᷄Ḍᷖᷨᶙĕݭ
    Ɣ ݇᥉჌ѩᶙɛƒᷥͮᶅ}‹yq{̣
    ż ᭆ᭄ᭆᭆۏĄਵ
    ż ୽ኀᡮ༥ṋᶬᶃ௄᷐Ḍ
    ż e‹q‘q‹˜Ṏ5qi’}giyᷟᶍ0ḄᶳṏᵩḧḘḃᷥפᅜΒḕḡᶲḌ
    y\‰‰ḞḤ
    

    View Slide

22. Ȼȼ
    Ȼȼ
    Ḙᷨš
    Ɣ ṋฎዎאᓙᶺḀ\ooiˆᰦqy‹ᷥဥᒬ
    Ɣ þ᝞ᷨ,i…}‰q‹}ˆ˜ḧ5qi’}giyṋ
    }ˆ}Œ‹q{iᮼy}’̣
    Ɣ þ᝞ᷨັᤞṋ0q-‹\‹iᶉ෽ࠌṋჄ๗ḛḌṖḲᷥԌਛ
    ż {gˆ}qgᰦi‘iy}…iˆ‰ᰦᰀ᱃ᰦ0ᰦy\˜iˆᰦᰀ᱃ᰦinq{iᰦ0ᰦ‰‹\‹i
    Ɣ }}oyiᰦŒ\‘\ḁᶳᶆḁḇᢩᷨͩ
    Ɣ ‹yq{‹ᷨ؏ɚ
    Ɣ ᖡüᶳ᷀ḡᷟᶲႵࡰᷨǑ௅
    

    View Slide

23. ȻȽ
    ȻȽ
    ᭋᮩ ÿ׶ᷥḇᶰᵺ᷋ḟḇᷝᶢḛḌḞ᷐ᷨ/q…‰
    

    View Slide

24. ȻȾ
    ȻȾ
    ݇᥉჌ѩᶣؐḏ᷊
    

    View Slide

25. Ȼȿ
    Ȼȿ
    ؐḏᶲḇᶰᵺ᷋ḟᶣᅫᶑᡲ᷊ᷟ
    Ɣ ܜ຦
    ż p‹‹…‰᮫᮹᮹‹’q‹‹iˆᮩe}z᮹‹ᰅ’\g\᮹‰‹\‹Œ‰᮹ᭅᭇᭅᭉᭈᭈᭈ᭍ᭊᭋᭋ᭍
    ᭊᭈᭋᭇᭌᭊᭅ
    Ɣ -x˜i\…ᷨӅΒ
    ż ᭆ᜔ᡲᷨḜ᷿ḇᷝḨᷨḲḤᭅযṋ४Ѝᷥ˚Ḇܷḡ
    /\xŒ‹}ᰦ6\g\
    ḇᶰᵺ᷋ḟḇᷝᶢṋοΧᷨṖḲᷥᯠᅫᶑᡲᷟ
    ᷊ᯡᒬḲ᷈ḫᶣᰝḇᶰᵺ᷋ḟḇᷝᶢṋᅋᶺ᷊ʭ
    ᔯḕᰝযü᷿ᷨḊᶢḁᷔᷝᶢᷨΗᷖඎ᷄ᭅḜḢḯ
    ᷿ᷥḛḌ᷇ḧᶉḛ
    p‹‹…‰᮫᮹᮹‹ᰀ’\g\ᮩp\‹i{\dy}oᮩw…᮹i{‹ˆ˜᮹eyi\{ᰀe}giᰀ
    ‹p\‹ᰀ’}ˆx‰
    Ჳ‹ᰅ’\g\
    

    View Slide

26. ȻɁ
    ȻɁ
    ᮾi…ˆie\‹igᷨ౦຦
    

    View Slide

27. Ȼɂ
    Ȼɂ
    བྷᷨˌᷨḇᶰᵺ᷋ḟḇᷝᶢᷥᣛĕᮭ
    Ɣ ᵵḭḤᷖ᷇ḭḤᷖཙḕḞᶲᮭḭḡᷟḌ
    ż ݇᥉჌ѩᷖඎᢡᷥۛᶙḌ
    ż ৙ᡲᶙඎᢡᷥඎ᷊ᷟḌ
    ż ᶢḯḧ࡚ࠗḕḡḥ᷀ḯḨ̣ᶇᶿḛḌ
    Ɣ -x˜i\…ᶉᷖᰝ}‹yq{̣ᷨšᷥ
    }ˆ}Œ‹q{iṎy}’̣ḕḞᶲ᝞ʭᶙḞ᷊ḏᷜ
    ż ȾɌ᥎۟ṋᔗԡṀᷟᶲᶉᰝ४᷐ḡᔷັṋၫḡḌ
    

    View Slide

28. ȼȹ
    ȼȹ
    ᶟಫቍᵵḆᶙḧḲᶟṦᶲ᷍ḕḞ
    

    View Slide