Estas tempo anstataŭigi GIF per AV1-video

Estas tempo anstataŭigi GIF per AV1-video

Estas 2019 kaj jam estas tempo, ke ni decidis pri GIF-oj (ne, ni ne parolas pri ĉi tiu decido! Ni neniam konsentos ĉi tie! - ĉi tie ni parolas pri prononco en la angla, por ni tio ne gravas - ĉ. traduko). GIFoj okupas grandegan spacon (kutime plurajn megabajtojn!), kio, se vi estas retejo-programisto, tute kontraŭas viajn dezirojn! Kiel retejo-programisto, vi volas minimumigi la aferojn, kiujn uzantoj bezonas elŝuti, por ke la retejo ŝarĝu rapide. Pro la sama kialo, vi malgrandigas JavaScript, optimumigas PNG, JPEG kaj foje konvertas JPEG al WebP. Sed kion fari kun la malnova GIF?

Ni ne bezonos GIF-ojn kien ni iras!

Se via celo estas plibonigi la rapidecon de ŝarĝo de retejo, tiam vi devas forigi GIF-ojn! Sed kiel vi faras viglajn bildojn? La respondo estas video. Kaj en la plej multaj kazoj, vi ricevos pli bonan kvaliton kaj spacŝparojn de 50-90%! En la vivo, plej multaj aferoj havas siajn avantaĝojn kaj malavantaĝojn. Kiam vi anstataŭigas GIF per video, plej ofte vi ne povos trovi ajnajn malavantaĝojn.

Malsupren ĉiuj GIF-oj!

Feliĉe, anstataŭigi GIF-ojn per videoj estis kutima en la lastaj jaroj, do ĉiuj necesaj iloj jam estas uzataj. En ĉi tiu afiŝo, mi ne reinventos la radon, sed nur iomete plibonigos la ekzistantajn solvojn. Do jen la esenco:

  1. Prenu GIF kaj konvertu ĝin al video
  2. Kodi la videon per H.264 aŭ VP9, ​​t.e. kunpremu ĝin kaj paku ĝin en MP4 aŭ WebM-ujon
  3. Anstataŭigi <img> kun vigla GIF ŝaltita <video> kun rulilo
  4. Ŝaltu aŭtomatan ludadon sen sono kaj buklo por GIF-efekto

Guglo havas bonan dokumentadon priskribanta la procezon.

Estas 2019

Estas 2019 nun. Progreso antaŭeniras, kaj ni devas daŭrigi kun ĝi. Ĝis nun ni havis du kodek-opciojn kiuj estas vaste subtenataj tra ĉiuj retumiloj kaj videokodigaj iloj:

  1. H.264 - enkondukita en 2003 kaj plej vaste uzata hodiaŭ
  2. VP9 - aperis en 2013 kaj atingis kunpremajn plibonigojn de preskaŭ 50% kompare kun H.264, kvankam kiel ili skribas ĉi tie ne ĉio ne ĉiam estas tiel rozkolora

Notu: Kvankam H.265 estas la sekva versio de H.264 kaj kapablas konkuri kun VP9, ​​mi ne konsideras ĝin pro malbona retumila subteno, kiel montrite en la paĝo. https://caniuse.com/#feat=hevc. Licencaj kostoj estas la ĉefa kialo, kial H.265 ne tiom disvastiĝis kiel H.264 kaj kial la konsorcio Alliance of Open Media laboras kun senpaga kodeko AV1.

Memoru, nia celo estas ŝrumpi grandegajn GIF-ojn al la plej malgranda ebla grandeco por akceli ŝarĝtempojn. Estus stranga 2019, se ni ne havus novan normon por video-kunpremado en nia arsenalo. Sed ĝi ekzistas kaj nomiĝas AV1. Kun AV1 vi povas atingi proksimume 30% plibonigon en kunpremo kompare kun VP9. Lepota! 🙂

AV1 estas je via servo ekde 2019!

Sur labortabloj

Lastatempe subteno por AV1-videomalkodado estis aldonita al labortablaj versioj Google Chrome 70 и Mozilla Firefox 65. Ĝuste nun Firefox-subteno estas fuŝa kaj povas kaŭzi kraŝojn, sed aferoj devus pliboniĝi kun aldono de dav1d malĉifrilo jam en Firefox 67 (jam liberigita, sed subteno aperis - ĉ. traduk.). Por detaloj pri la nova versio legu - dav1d 0.3.0 eldono: eĉ pli rapide!

Sur saĝtelefonoj

Nuntempe ne ekzistas aparatara subteno por saĝtelefonoj pro manko de taŭgaj malĉifriloj. Vi povas fari programaron malkodi, kvankam ĉi tio kondukos al pliigita bateriokonsumo. La unuaj moveblaj SOC-oj subtenantaj AV1-hardvarmalkodigon aperos en 2020.

Kaj tiam la legantoj de la artikolo estas kiel, "do se poŝtelefonoj ankoraŭ ne subtenas ĝin ĝuste, kial uzi AV1?"

AV1 estas sufiĉe nova kodeko, kaj ni estas ĉe la komenco mem de ĝia adapto. Pensu pri ĉi tiu artikolo kiel la stadio "dum vi kuiras, la homamaso sekvos". Labortabla subteno en si mem akcelos retejojn por iuj el la spektantaro. Kaj malnovaj kodekoj povas esti uzataj kiel alternativa scenaro kiam AV1 ne estas subtenata sur la cela aparato. Sed ĉar uzantoj ŝanĝas al aparatoj kun AV1-subteno, ĉio estos preta. Por atingi tion, ni devas krei video-etikedon kiel montrite sube, kiu permesos al la retumilo elekti sian preferatan formaton - AV1 - >> VP9 - >> H.264. Nu, se la uzanto havas tre malnovan aparaton aŭ navigilon, kiu tute ne subtenas videon (kio estas ege neverŝajna kun H264), tiam li nur vidos la 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>

Kreado de AV1

Krei videojn en AV1 estas facila. Elŝutu la plej novan ffmpeg-konstruaĵon por via sistemo de ĉi tie kaj uzu la komandojn sube. Ni uzas 2 enirpermesilojn por atingi la celitan bitratecon. Por fari tion ni rulos ffmpeg dufoje. La unuan fojon ni skribas la rezulton al neekzistanta dosiero. Ĉi tio kreos protokolon, kiu estos bezonata por la dua kuro de 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

Jen divido de la parametroj:

-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 - Включаем быстрый старт видео, перемещая часть данных в начало файла. Это позволит начать воспроизведение ещё до полной загрузка файла.

Farante GIF-ojn

Por krei la GIF mi uzis la suban komandon. Por redukti la grandecon, mi skalis la GIF al 720px larĝa kaj 12 fps anstataŭ la originala 24 fps video.

./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

Testrezultoj

Estas pli bone vidi unufoje ol legi cent fojojn, ĉu ne? Ni certigu, ke la AV1 estas la ĝusta elekto por niaj celoj. Mi prenis la senpagan filmeton Tears Of Steel disponebla ĉi tie https://mango.blender.org/, kaj konvertis ĝin uzante proksimume la saman bitrapidecon por AV1, VP9, ​​​​H.264-kodekoj. La rezultoj estas sube, por ke vi povu kompari ilin mem.

Noto 1: Se la ĉi-suba dosiero ne ŝargiĝas por vi, eble estas tempo ĝisdatigi vian retumilon. Mi rekomendus retumilon bazitan sur Chromium kiel Chrome, Vivaldi, Brave aŭ Opera. Jen la plej novaj informoj pri AV1-subteno https://caniuse.com/#feat=av1

Noto 2: Por Firefox 66 en Linukso vi devos agordi la flagon media.av1.enabled en signifon true в about:config

Noto 3: Mi decidis ne inkluzivi regulajn GIF-ojn sube pro ilia granda grandeco kaj la kvanto da datumoj kiujn ĝi postulus por ŝargi ĉi tiun paĝon! (Kio estus ironia, ĉar ĉi tiu paĝo temas pri redukti la kvanton da datumoj sur paĝo :)). Sed vi povas vidi la finajn GIF-ojn ĉi tie https://github.com/singhkays/its-time-replace-gifs-with-av1-video/blob/master/GIFs

Noto de la tradukinto: Habr ne permesas al vi ebligi aŭtomatan ludadon kaj cirkuli la dosieron, do vi povas nur taksi la kvaliton. Vi povas vidi kiel la "viglaj bildoj" aspektos en vivas originala artikolo.

Sceno 1 @ 200 Kbps

Estas multe da movado ĉi tie, kiu estas speciale sentema ĉe malaltaj bitrapidoj. Vi povas tuj vidi kiom malbona estas H.264 ĉe ĉi tiu bitrapideco; kvadratoj estas tuj videblaj. VP9 iomete plibonigas la situacion, sed la kvadratoj ankoraŭ estas videblaj. AV1 klare venkas, produktante evidente pli bonan bildon.

H.264

VP9

AV1

Sceno 2 @ 200 Kbps

Estas multe da diafana CGI-enhavo ĉi tie. La rezultoj ne estas tiel malsamaj kiel la lasta fojo, sed ĝenerale la AV1 aspektas pli bone.

H.264

VP9

AV1

Sceno 3 @ 100 Kbps

En ĉi tiu sceno, ni malaltigas la bitratecon al 100 Kbps kaj la rezultoj estas konsekvencaj. AV1 konservas sian gvidadon eĉ ĉe malaltaj bitrapidoj!

H.264

VP9

AV1

Ĉerizo sur la kuko

Por fini ĉi tiun artikolon sentante la kvanton da bendolarĝo ŝparita kompare kun GIF - la totala grandeco de ĉiuj videoj estas pli alta... 1.62 MB!! Ĝuste. Kelkaj fikaj 1,708,032 bajtoj! Por komparo, jen la GIF kaj AV1 videograndecoj por ĉiu sceno

GIF
AV1

Sceno 1
11.7 MB
0.33 MB

Sceno 2
7.27 MB
0.18 MB

Sceno 3
5.62 MB
0.088 MB

Simple impresa! Ĉu ne?

Notu: La dosiergrandoj de VP9 kaj H264 ne estas donitaj, ĉar ili preskaŭ ne diferencas de AV1 pro la uzo de la sama bitrapideco. Estus superflua aldoni du pliajn kolumnojn kun la samaj grandecoj, nur por reliefigi, ke ĉi tiuj kodekoj produktas multe pli bonan kvaliton ol GIF ĉe multe pli malgrandaj dosiergrandoj.

fonto: www.habr.com

Aldoni komenton