វាដល់ពេលហើយដើម្បីជំនួស GIF ជាមួយវីដេអូ AV1

វាជាឆ្នាំ 2019 ហើយវាជាពេលវេលាដែលយើងសម្រេចចិត្តលើ GIFs (ទេ យើងមិននិយាយអំពីការសម្រេចចិត្តនេះទេ! យើងនឹងមិនយល់ព្រមនៅទីនេះទេ! - នៅទីនេះយើងកំពុងនិយាយអំពីការបញ្ចេញសំឡេងជាភាសាអង់គ្លេសសម្រាប់យើងនេះមិនពាក់ព័ន្ធទេ - ប្រហាក់ប្រហែល។ ការបកប្រែ) GIFs យកទំហំដ៏ធំ (ជាធម្មតាច្រើនមេកាបៃ!) ដែលប្រសិនបើអ្នកជាអ្នកបង្កើតគេហទំព័រ វាផ្ទុយទាំងស្រុងទៅនឹងបំណងប្រាថ្នារបស់អ្នក! ក្នុងនាមជាអ្នកបង្កើតគេហទំព័រ អ្នកចង់កាត់បន្ថយនូវអ្វីដែលអ្នកប្រើប្រាស់ត្រូវការដើម្បីទាញយក ដើម្បីឱ្យគេហទំព័រផ្ទុកលឿន។ សម្រាប់ហេតុផលដូចគ្នានេះ អ្នកបង្រួម JavaScript បង្កើនប្រសិទ្ធភាព PNG JPEG និងពេលខ្លះបំប្លែង JPEG ទៅ WebP. ប៉ុន្តែអ្វីដែលត្រូវធ្វើជាមួយ GIF ចាស់?

យើងនឹងមិនត្រូវការ GIFs ដែលជាកន្លែងដែលយើងទៅ!

ប្រសិនបើគោលដៅរបស់អ្នកគឺដើម្បីបង្កើនល្បឿនផ្ទុកគេហទំព័រ នោះអ្នកត្រូវកម្ចាត់ GIFs! ប៉ុន្តែតើអ្នកបង្កើតរូបភាពមានចលនាដោយរបៀបណា? ចម្លើយគឺវីដេអូ។ ហើយក្នុងករណីភាគច្រើន អ្នកនឹងទទួលបានគុណភាពកាន់តែប្រសើរ និងសន្សំសំចៃទំហំ 50-90%! នៅក្នុងជីវិត អ្វីៗភាគច្រើនមានគុណសម្បត្តិ និងគុណវិបត្តិរបស់វា។ នៅពេលអ្នកជំនួស GIF ជាមួយវីដេអូ ភាគច្រើនអ្នកនឹងមិនអាចរកឃើញគុណវិបត្តិណាមួយឡើយ។

ចុះជាមួយ GIFs ទាំងអស់!

ជាសំណាងល្អ ការជំនួស GIFs ជាមួយវីដេអូគឺជារឿងធម្មតានៅក្នុងប៉ុន្មានឆ្នាំថ្មីៗនេះ ដូច្នេះឧបករណ៍ចាំបាច់ទាំងអស់ត្រូវបានប្រើប្រាស់រួចហើយ។ នៅក្នុងការប្រកាសនេះ ខ្ញុំនឹងមិនបង្កើតកង់ឡើងវិញទេ ប៉ុន្តែនឹងកែលម្អដំណោះស្រាយដែលមានស្រាប់បន្តិចប៉ុណ្ណោះ។ ដូច្នេះ​នេះ​ជា​ចំណុច​សំខាន់៖

1. យក GIF ហើយបំប្លែងវាទៅជាវីដេអូ
2. អ៊ិនកូដវីដេអូដោយប្រើ H.264 ឬ VP9, ​​​​i.e. បង្រួមវាហើយខ្ចប់វាទៅក្នុងធុង MP4 ឬ WebM
3. ជំនួស <img> ជាមួយ GIF ដែលមានចលនានៅលើ <video> ជាមួយ roller
4. បើកការលេងដោយស្វ័យប្រវត្តិដោយគ្មានសំឡេង និងរង្វិលជុំសម្រាប់បែបផែន GIF

Google មានឯកសារល្អដែលពិពណ៌នាអំពីដំណើរការនេះ។

វាជាឆ្នាំ 2019

វាជាឆ្នាំ 2019 ឥឡូវនេះ។ វឌ្ឍនភាពដើរទៅមុខ ហើយយើងត្រូវតាមទាន់។ រហូតមកដល់ពេលនេះ យើងមានជម្រើសកូឌិកពីរ ដែលត្រូវបានគាំទ្រយ៉ាងទូលំទូលាយនៅគ្រប់កម្មវិធីរុករកទាំងអស់ និងឧបករណ៍បំប្លែងវីដេអូ៖

1. H.264 - ណែនាំក្នុងឆ្នាំ 2003 និងប្រើប្រាស់យ៉ាងទូលំទូលាយបំផុតនាពេលបច្ចុប្បន្ននេះ។
2. VP9 - បានបង្ហាញខ្លួននៅក្នុងឆ្នាំ 2013 និងសម្រេចបាននូវការកែលម្អការបង្ហាប់ស្ទើរតែ 50% បើប្រៀបធៀបទៅនឹង H.264 ទោះបីជា ដូចដែលពួកគេសរសេរនៅទីនេះ មិនមែន​គ្រប់​យ៉ាង​មិន​តែង​តែ​មាន​ពណ៌​ផ្កាឈូក​នោះ​ទេ។

ចំណាំ: ទោះបីជា H.265 គឺជាកំណែបន្ទាប់នៃ H.264 និងមានសមត្ថភាពប្រកួតប្រជែងជាមួយ VP9 ក៏ដោយ ខ្ញុំមិនចាត់ទុកវាដោយសារតែការគាំទ្រកម្មវិធីរុករកមិនល្អ ដូចដែលបានបង្ហាញនៅលើទំព័រ https://caniuse.com/#feat=hevc. ការចំណាយលើអាជ្ញាបណ្ណគឺជាហេតុផលចម្បងដែលហេតុអ្វីបានជា H.265 មិនរីករាលដាលដូច H.264 ហើយហេតុអ្វីបានជា Alliance of Open Media consortium កំពុងធ្វើការជាមួយកូឌិកគ្មានសួយសារអាករ AV1។

សូមចាំថា គោលដៅរបស់យើងគឺបង្រួម GIFs ដ៏ធំទៅទំហំតូចបំផុតដែលអាចធ្វើទៅបាន ដើម្បីបង្កើនល្បឿននៃការផ្ទុក។ វានឹងក្លាយជារឿងចម្លែកនៅឆ្នាំ 2019 ប្រសិនបើយើងមិនមានស្តង់ដារថ្មីសម្រាប់ការបង្ហាប់វីដេអូនៅក្នុងឃ្លាំងអាវុធរបស់យើង។ ប៉ុន្តែវាមានហើយត្រូវបានគេហៅថា AV1 ។ ជាមួយ AV1 អ្នកអាចធ្វើបាន សម្រេចបាននូវការធ្វើឱ្យប្រសើរឡើងប្រហែល 30% ក្នុងការបង្ហាប់បើប្រៀបធៀបទៅនឹង VP9. ឡេប៉ូតា! 🙂

AV1 គឺនៅសេវាកម្មរបស់អ្នកតាំងពីឆ្នាំ 2019!

នៅលើកុំព្យូទ័រលើតុ

ថ្មីៗនេះការគាំទ្រសម្រាប់ការឌិកូដវីដេអូ AV1 ត្រូវបានបន្ថែមទៅកំណែផ្ទៃតុ Google Chrome 70 и កម្មវិធី Mozilla Firefox 65. ឥឡូវនេះការគាំទ្ររបស់ Firefox គឺមានបញ្ហា ហើយអាចបណ្តាលឱ្យគាំង ប៉ុន្តែអ្វីៗគួរតែប្រសើរឡើងជាមួយនឹងការបន្ថែម dav1d ឧបករណ៍ឌិកូដ រួចហើយនៅក្នុង Firefox 67 (បានចេញផ្សាយរួចហើយ ប៉ុន្តែការគាំទ្របានលេចចេញមក - ប្រហែល បកប្រែ។ ). សម្រាប់ព័ត៌មានលម្អិតអំពីកំណែថ្មី សូមអាន - dav1d 0.3.0 ចេញផ្សាយ៖ កាន់តែលឿន!

នៅលើស្មាតហ្វូន

បច្ចុប្បន្ននេះមិនមានការគាំទ្រផ្នែករឹងសម្រាប់ស្មាតហ្វូនដោយសារតែខ្វះឧបករណ៍ឌិកូដសមរម្យ។ អ្នកអាចធ្វើការឌិកូដកម្មវិធី ទោះបីជាវានឹងនាំឱ្យការប្រើប្រាស់ថ្មកើនឡើងក៏ដោយ។ SOCs ចល័តដំបូងដែលគាំទ្រការឌិកូដផ្នែករឹង AV1 នឹងបង្ហាញនៅឆ្នាំ 2020។

ហើយបន្ទាប់មកអ្នកអានអត្ថបទគឺដូចជា "ដូច្នេះប្រសិនបើទូរស័ព្ទចល័តមិនគាំទ្រវាឱ្យបានត្រឹមត្រូវទេហេតុអ្វីបានជាប្រើ AV1?"

AV1 គឺជាកូឌិកថ្មីគួរសម ហើយយើងនៅដើមដំបូងនៃការសម្របខ្លួនរបស់វា។ សូម​គិត​អំពី​អត្ថបទ​នេះ​ថា​ជា «ពេល​អ្នក​ធ្វើ​ម្ហូប ហ្វូង​មនុស្ស​នឹង​ដើរ​តាម»។ ការគាំទ្រលើកុំព្យូទ័រនឹងបង្កើនល្បឿនគេហទំព័រសម្រាប់ទស្សនិកជនមួយចំនួន។ ហើយកូឌិកចាស់អាចត្រូវបានប្រើជាសេណារីយ៉ូជំនួសនៅពេលដែល AV1 មិនត្រូវបានគាំទ្រនៅលើឧបករណ៍គោលដៅ។ ប៉ុន្តែនៅពេលដែលអ្នកប្រើប្រាស់ប្តូរទៅឧបករណ៍ដែលមានការគាំទ្រ AV1 អ្វីៗនឹងរួចរាល់។ ដើម្បីសម្រេចបាននូវចំណុចនេះ យើងត្រូវបង្កើតស្លាកវីដេអូដូចបានបង្ហាញខាងក្រោម ដែលនឹងអនុញ្ញាតឱ្យកម្មវិធីរុករកជ្រើសរើសទម្រង់ដែលខ្លួនពេញចិត្ត − AV1 - >> VP9 - >> H.264. ជាការប្រសើរណាស់ ប្រសិនបើអ្នកប្រើមានឧបករណ៍ចាស់ខ្លាំង ឬកម្មវិធីរុករកដែលមិនគាំទ្រវីដេអូទាល់តែសោះ (ដែលមិនទំនងខ្លាំងជាមួយ H264)បន្ទាប់មកគាត់នឹងឃើញ GIF

<video style="display:block; margin: 0 auto;" autoplay loop muted playsinline poster="RollingCredits.jpg">
  <source src="media/RollingCredits.av1.mp4" type="video/mp4">
  <source src="media/RollingCredits.vp9.webm" type="video/webm">
  <source src="media/RollingCredits.x264.mp4" type="video/mp4">
  <img src="media/RollingCredits.gif">
</video>

ការបង្កើត AV1

ការបង្កើតវីដេអូក្នុង AV1 គឺងាយស្រួល។ ទាញយក ffmpeg build ចុងក្រោយបំផុតសម្រាប់ប្រព័ន្ធរបស់អ្នកពីទីនេះ ហើយប្រើពាក្យបញ្ជាខាងក្រោម។ យើងប្រើ 2 passes ដើម្បីសម្រេចបាននូវអត្រាប៊ីតគោលដៅ។ ដើម្បីធ្វើដូចនេះយើងនឹងដំណើរការ ffmpeg ពីរដង។ ជាលើកដំបូងដែលយើងសរសេរលទ្ធផលទៅឯកសារដែលមិនមាន។ វានឹងបង្កើតកំណត់ហេតុដែលនឹងត្រូវការសម្រាប់ការដំណើរការទីពីរនៃ ffmpeg ។

# Linux or Mac
## Проход 1
ffmpeg -i input.mp4 -c:v libaom-av1 -b:v 200k -filter:v scale=720:-1 -strict experimental -cpu-used 1 -tile-columns 2 -row-mt 1 -threads 8 -pass 1 -f mp4 /dev/null && 
## Проход 2
ffmpeg -i input.mp4 -pix_fmt yuv420p -movflags faststart -c:v libaom-av1 -b:v 200k -filter:v scale=720:-1 -strict experimental -cpu-used 1 -tile-columns 2 -row-mt 1 -threads 8 -pass 2 output.mp4

# Windows
## Проход 1
ffmpeg.exe -i input.mp4 -c:v libaom-av1 -b:v 200k -filter:v scale=720:-1 -strict experimental -cpu-used 1 -tile-columns 2 -row-mt 1 -threads 8 -pass 1 -f mp4 NUL && ^
## Проход 2
ffmpeg.exe -i input.mp4 -pix_fmt yuv420p -movflags faststart -c:v libaom-av1 -b:v 200k -filter:v scale=720:-1 -strict experimental -cpu-used 1 -tile-columns 2 -row-mt 1 -threads 8 -pass 2 output.mp4

នេះគឺជាការវិភាគនៃប៉ារ៉ាម៉ែត្រ៖

-i - Входной файл.

-pix_fmt - Используем формат 4:2:0 для выбора информации о цветности в видео. Существует много других возможных форматов, но 4:2:0 наиболее совместимый.

-c:v - Какой кодек использовать, в нашем случае - AV1.<br />
-b:v – Средний битрейт, которого мы хотим добиться.

-filter:v scale - Фильтр масштаба ffmpeg используется для уменьшения разрешения видео. Мы устанавливаем X:-1 что говорит ffmpeg уменьшить ширину до X, сохранив соотношение сторон.

-strict experimental - Надо указать, т.к. AV1 достаточно новый кодек.

-cpu-used - Ужасно названный параметр, который на самом деле используется для выбора уровня качества видео. Возможные значения 0-4. Чем меньше значение, тем лучше качество и, соответственно, больше время, которое займёт кодировка.

-tile-columns - Для использования нескольких тредов. Говорит AV1 разбить видео на отдельные колонки, которые могут быть перекодированы независимо для лучшей утилизации ЦПУ.

-row-mt – Тоже, что и предыдущий параметр, но разбивает так же на строки внутри колонок.

-threads - Количество тредов.

-pass - Какой проход сейчас выполняется.

-f - Используется только при первом проходе. Указывает формат выходного файла, т.е. MP4 в нашем случае.

-movflags faststart - Включаем быстрый старт видео, перемещая часть данных в начало файла. Это позволит начать воспроизведение ещё до полной загрузка файла.

ការបង្កើត GIFs

ដើម្បីបង្កើត GIF ខ្ញុំបានប្រើពាក្យបញ្ជាខាងក្រោម។ ដើម្បីកាត់បន្ថយទំហំ ខ្ញុំបានធ្វើមាត្រដ្ឋាន GIF ទៅ 720px wide និង 12 fps ជំនួសឱ្យវីដេអូ 24 fps ដើម។

./ffmpeg -i /mnt/c/Users/kasing/Desktop/ToS.mov -ss 00:08:08 -t 12
-filter_complex "[0:v] fps=12,scale=720:-1" -y scene2.gif

លទ្ធផលតេស្ត

មើលម្តង ប្រសើរជាងអានមួយរយដង មែនទេ? សូមប្រាកដថា AV1 គឺជាជម្រើសដ៏ត្រឹមត្រូវសម្រាប់គោលបំណងរបស់យើង។ ខ្ញុំបានយកវីដេអូ Tears Of Steel ដោយឥតគិតថ្លៃដែលមាននៅទីនេះ https://mango.blender.org/ហើយបានបំប្លែងវាដោយប្រើអត្រាប៊ីតដូចគ្នាសម្រាប់កូឌិក AV1, VP9, ​​​​H.264។ លទ្ធផលគឺខាងក្រោម ដូច្នេះអ្នកអាចប្រៀបធៀបពួកវាសម្រាប់ខ្លួនអ្នក។

ចំណាំ 1: ប្រសិនបើឯកសារខាងក្រោមមិនផ្ទុកសម្រាប់អ្នកទេ វាអាចដល់ពេលធ្វើបច្ចុប្បន្នភាពកម្មវិធីរុករករបស់អ្នក។ ខ្ញុំនឹងណែនាំកម្មវិធីរុករកដែលមានមូលដ្ឋានលើ Chromium ដូចជា Chrome, Vivaldi, Brave ឬ Opera ។ នេះគឺជាព័ត៌មានចុងក្រោយបំផុតស្តីពីការគាំទ្រ AV1 https://caniuse.com/#feat=av1

ចំណាំ 2: សម្រាប់ Firefox 66 នៅលើ Linux អ្នកនឹងត្រូវកំណត់ទង់ media.av1.enabled ចូលទៅក្នុងអត្ថន័យ true в about:config

ចំណាំ 3: ខ្ញុំបានសម្រេចចិត្តមិនរួមបញ្ចូល GIFs ធម្មតាខាងក្រោម ដោយសារទំហំធំរបស់វា និងចំនួនទិន្នន័យដែលវាត្រូវការដើម្បីផ្ទុកទំព័រនេះ! (ដែល​នឹង​ជា​រឿង​ហួសចិត្ត​ព្រោះ​ទំព័រ​នេះ​និយាយ​អំពី​ការ​កាត់​បន្ថយ​ចំនួន​ទិន្នន័យ​លើ​ទំព័រ :))។ ប៉ុន្តែអ្នកអាចឃើញ GIFs ចុងក្រោយនៅទីនេះ https://github.com/singhkays/its-time-replace-gifs-with-av1-video/blob/master/GIFs

កំណត់ចំណាំរបស់អ្នកបកប្រែ៖ Habr មិន​អនុញ្ញាត​ឱ្យ​អ្នក​បើក​ការ​លេង​ដោយ​ស្វ័យ​ប្រវត្តិ​និង​រង្វិលជុំ​ឯកសារ​ទេ ដូច្នេះ​អ្នក​អាច​វាយ​តម្លៃ​តែ​គុណភាព​ប៉ុណ្ណោះ។ អ្នកអាចមើលឃើញថា "រូបភាពមានចលនា" នឹងមើលទៅដូចការផ្សាយបន្តផ្ទាល់ អត្ថបទដើម.

ឈុតទី 1 @ 200 Kbps

មានចលនាជាច្រើននៅទីនេះ ដែលមានភាពរសើបជាពិសេសនៅអត្រាប៊ីតទាប។ អ្នកអាចមើលឃើញភ្លាមៗថាតើ H.264 អាក្រក់ប៉ុណ្ណានៅអត្រាប៊ីតនេះ ការ៉េអាចមើលឃើញភ្លាមៗ។ VP9 ធ្វើអោយស្ថានភាពប្រសើរឡើងបន្តិច ប៉ុន្តែការ៉េនៅតែអាចមើលឃើញ។ AV1 ឈ្នះយ៉ាងច្បាស់ បង្កើតរូបភាពច្បាស់ជាង។

H.264

VP9

AV1

ឈុតទី 2 @ 200 Kbps

មានមាតិកា CGI ល្អក់កករជាច្រើននៅទីនេះ។ លទ្ធផល​មិន​ខុស​ពី​លើក​មុន​ទេ ប៉ុន្តែ​ជា​រួម​ AV1 មើល​ទៅ​ល្អ​ជាង។

H.264

VP9

AV1

ឈុតទី 3 @ 100 Kbps

នៅក្នុងឈុតនេះ យើងបង្វែរអត្រាប៊ីតចុះមកត្រឹម 100 Kbps ហើយលទ្ធផលគឺស្រប។ AV1 រក្សាភាពជាអ្នកដឹកនាំរបស់ខ្លួន ទោះបីជាមានអត្រាប៊ីតទាបក៏ដោយ!

H.264

VP9

AV1

Cherry នៅលើនំ

ដើម្បីបញ្ចប់អត្ថបទនេះដោយមានអារម្មណ៍ថាចំនួន bandwidth ត្រូវបានរក្សាទុកបើប្រៀបធៀបទៅនឹង GIF - ទំហំសរុបនៃវីដេអូទាំងអស់គឺខ្ពស់ជាង... 1.62 មេកាបៃ!! ត្រូវហើយ។ 1,708,032 បៃ! សម្រាប់ការប្រៀបធៀប នេះគឺជាទំហំវីដេអូ GIF និង AV1 សម្រាប់ឈុតនីមួយៗ

GIF
AV1

ឈុតទី១
11.7 មេកាបៃ
0.33 មេកាបៃ

ឈុតទី១
7.27 មេកាបៃ
0.18 មេកាបៃ

ឈុតទី១
5.62 មេកាបៃ
0.088 មេកាបៃ

គ្រាន់​តែ​គួរ​ឱ្យ​ភ្ញាក់​ផ្អើល! មែនទេ?

ចំណាំ: ទំហំឯកសាររបស់ VP9 និង H264 មិនត្រូវបានផ្តល់ឱ្យទេ ព្រោះពួកវាមិនខុសពី AV1 ដោយសារការប្រើប្រាស់អត្រាប៊ីតដូចគ្នា។ វា​នឹង​មិន​ចាំបាច់​ត្រូវ​បន្ថែម​ជួរ​ឈរ​ពីរ​បន្ថែម​ទៀត​ដែល​មាន​ទំហំ​ដូច​គ្នា​នោះ​ទេ ដើម្បី​បញ្ជាក់​ថា​កូឌិក​ទាំងនេះ​ផលិត​បាន​គុណភាព​ល្អ​ជាង GIF នៅ​ទំហំ​ឯកសារ​តូច​ជាង​ច្រើន។

ប្រភព: www.habr.com