GIF ને AV1 વિડિઓ સાથે બદલવાનો સમય છે

તે 2019 છે અને તે સમય છે કે અમે GIFs (ના, અમે આ નિર્ણય વિશે વાત કરી રહ્યા નથી! અમે અહીં ક્યારેય સંમત થઈશું નહીં! - અહીં આપણે અંગ્રેજીમાં ઉચ્ચાર વિશે વાત કરી રહ્યા છીએ, અમારા માટે આ સંબંધિત નથી - આશરે. અનુવાદ). GIF મોટી માત્રામાં જગ્યા લે છે (સામાન્ય રીતે ઘણા મેગાબાઇટ્સ!), જે, જો તમે વેબ ડેવલપર છો, તો તે તમારી ઇચ્છાઓથી સંપૂર્ણપણે વિરુદ્ધ છે! વેબ ડેવલપર તરીકે, તમે વપરાશકર્તાઓને ડાઉનલોડ કરવા માટે જરૂરી વસ્તુઓને ઘટાડવા માંગો છો જેથી સાઇટ ઝડપથી લોડ થાય. આ જ કારણસર, તમે JavaScript ને નાનું કરો, PNG, JPEG ને ઑપ્ટિમાઇઝ કરો અને ક્યારેક કન્વર્ટ કરો JPEG થી WebP. પરંતુ જૂના GIF સાથે શું કરવું?

અમે જ્યાં જઈ રહ્યા છીએ ત્યાં અમને GIF ની જરૂર નથી!

જો તમારો ધ્યેય સાઇટ લોડિંગ સ્પીડને બહેતર બનાવવાનો છે, તો તમારે GIF થી છુટકારો મેળવવાની જરૂર છે! પરંતુ પછી તમે એનિમેટેડ ચિત્રો કેવી રીતે બનાવશો? જવાબ છે વિડિયો. અને મોટા ભાગના કિસ્સાઓમાં, તમને સારી ગુણવત્તા અને 50-90% ની જગ્યા બચત મળશે! જીવનમાં, મોટાભાગની વસ્તુઓના ફાયદા અને ગેરફાયદા હોય છે. જ્યારે તમે GIF ને વિડિયો સાથે બદલો છો, ત્યારે મોટાભાગે તમે કોઈ ગેરફાયદા શોધી શકશો નહીં.

બધા GIF સાથે ડાઉન કરો!

સદભાગ્યે, તાજેતરના વર્ષોમાં GIF ને વિડિયો સાથે બદલવું સામાન્ય બાબત છે, તેથી બધા જરૂરી સાધનો પહેલેથી ઉપયોગમાં છે. આ પોસ્ટમાં, હું વ્હીલને ફરીથી શોધીશ નહીં, પરંતુ હાલના ઉકેલોમાં થોડો સુધારો કરીશ. તેથી અહીં ભાવાર્થ છે:

1. એક GIF લો અને તેને વીડિયોમાં કન્વર્ટ કરો
2. H.264 અથવા VP9 નો ઉપયોગ કરીને વિડિઓને એન્કોડ કરો, એટલે કે. તેને સંકુચિત કરો અને તેને MP4 અથવા WebM કન્ટેનરમાં પેક કરો
3. બદલો <img> એનિમેટેડ GIF ચાલુ સાથે <video> રોલર સાથે
4. GIF ઇફેક્ટ માટે અવાજ અને લૂપ વિના ઑટોપ્લે ચાલુ કરો

Google પાસે પ્રક્રિયાનું વર્ણન કરતા સારા દસ્તાવેજો છે.

તે 2019 છે

હવે 2019 છે. પ્રગતિ આગળ વધે છે, અને આપણે તેની સાથે રહેવું જોઈએ. અત્યાર સુધી અમારી પાસે બે કોડેક વિકલ્પો છે જે તમામ બ્રાઉઝર્સ અને વિડિયો એન્કોડિંગ ટૂલ્સમાં વ્યાપકપણે સમર્થિત છે:

1. H.264 - 2003 માં રજૂ કરવામાં આવ્યું અને આજે સૌથી વધુ ઉપયોગમાં લેવાય છે
2. VP9 - 2013 માં દેખાયો અને H.50 ની સરખામણીમાં લગભગ 264% ના સંકોચન સુધારણા હાંસલ કર્યા, જોકે જેમ તેઓ અહીં લખે છે બધું હંમેશા એટલું રોઝી નથી હોતું

ઉદાહરણ: જો કે H.265 એ H.264 નું આગલું સંસ્કરણ છે અને તે VP9 સાથે સ્પર્ધા કરવા સક્ષમ છે, હું પૃષ્ઠ પર બતાવ્યા પ્રમાણે નબળા બ્રાઉઝર સપોર્ટને કારણે તેને ધ્યાનમાં લેતો નથી. https://caniuse.com/#feat=hevc. લાયસન્સ ખર્ચ એ મુખ્ય કારણ છે કે શા માટે H.265 H.264 જેટલું વ્યાપક બન્યું નથી અને શા માટે એલાયન્સ ઑફ ઓપન મીડિયા કન્સોર્ટિયમ રોયલ્ટી-ફ્રી કોડેક, AV1 સાથે કામ કરી રહ્યું છે.

યાદ રાખો, અમારો ધ્યેય લોડિંગ સમયને ઝડપી બનાવવા માટે વિશાળ GIF ને શક્ય તેટલા નાના કદમાં સંકોચવાનો છે. જો અમારી પાસે અમારા શસ્ત્રાગારમાં વિડિઓ કમ્પ્રેશન માટે નવું ધોરણ ન હોય તો તે એક વિચિત્ર 2019 હશે. પરંતુ તે અસ્તિત્વમાં છે અને તેને AV1 કહેવામાં આવે છે. AV1 સાથે તમે કરી શકો છો VP30 ની સરખામણીમાં કમ્પ્રેશનમાં આશરે 9% સુધારો હાંસલ કરો. લેપોટા! 🙂

AV1 2019 થી તમારી સેવામાં છે!

ડેસ્કટોપ પર

તાજેતરમાં AV1 વિડિયો ડીકોડિંગ માટે સપોર્ટ ડેસ્કટૉપ વર્ઝનમાં ઉમેરવામાં આવ્યો હતો Google Chrome 70 и મોઝિલા ફાયરફોક્સ 65. અત્યારે ફાયરફોક્સ સપોર્ટ બગડેલ છે અને ક્રેશનું કારણ બની શકે છે, પરંતુ તેના ઉમેરા સાથે વસ્તુઓમાં સુધારો થવો જોઈએ dav1d ડીકોડર પહેલાથી જ ફાયરફોક્સ 67 માં (પહેલાથી જ રીલિઝ થયું છે, પરંતુ સપોર્ટ દેખાયો છે - આશરે. અનુવાદ.). નવા સંસ્કરણ વિશે વિગતો માટે વાંચો - dav1d 0.3.0 રિલીઝ: વધુ ઝડપી!

સ્માર્ટફોન પર

યોગ્ય ડીકોડરના અભાવને કારણે સ્માર્ટફોન માટે હાલમાં કોઈ હાર્ડવેર સપોર્ટ નથી. તમે સોફ્ટવેર ડીકોડિંગ કરી શકો છો, જો કે આનાથી બેટરીનો વપરાશ વધશે. AV1 હાર્ડવેર ડીકોડિંગને સપોર્ટ કરતી પ્રથમ મોબાઇલ SOC 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 બિલ્ડ ડાઉનલોડ કરો અને નીચેના આદેશોનો ઉપયોગ કરો. લક્ષ્ય બિટરેટ હાંસલ કરવા માટે અમે 2 પાસનો ઉપયોગ કરીએ છીએ. આ કરવા માટે આપણે 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 - Включаем быстрый старт видео, перемещая часть данных в начало файла. Это позволит начать воспроизведение ещё до полной загрузка файла.

GIF બનાવે છે

GIF બનાવવા માટે મેં નીચેના આદેશનો ઉપયોગ કર્યો. કદ ઘટાડવા માટે, મેં મૂળ 720 fps વિડિયોને બદલે GIF ને 12px પહોળા અને 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 એ અમારા હેતુઓ માટે યોગ્ય પસંદગી છે. મેં અહીં ઉપલબ્ધ ટિયર્સ ઑફ સ્ટીલનો મફત વિડિયો લીધો https://mango.blender.org/, અને AV1, VP9, ​​H.264 કોડેક્સ માટે લગભગ સમાન બિટરેટનો ઉપયોગ કરીને તેને રૂપાંતરિત કર્યું. પરિણામો નીચે આપેલ છે જેથી કરીને તમે તેમની તમારા માટે સરખામણી કરી શકો.

નોંધ 1: જો નીચેની ફાઇલ તમારા માટે લોડ થતી નથી, તો તમારા બ્રાઉઝરને અપડેટ કરવાનો સમય આવી શકે છે. હું Chrome, Vivaldi, Brave અથવા Opera જેવા ક્રોમિયમ આધારિત બ્રાઉઝરની ભલામણ કરીશ. અહીં AV1 સપોર્ટ પર નવીનતમ માહિતી છે https://caniuse.com/#feat=av1

નોંધ 2: Linux પર Firefox 66 માટે તમારે ધ્વજ સેટ કરવાની જરૂર પડશે media.av1.enabled અર્થમાં true в about:config

નોંધ 3: મેં તેમના મોટા કદ અને આ પૃષ્ઠને લોડ કરવા માટે જરૂરી ડેટાના જથ્થાને કારણે નીચે નિયમિત GIF નો સમાવેશ ન કરવાનું નક્કી કર્યું છે! (જે વ્યંગાત્મક હશે, કારણ કે આ પૃષ્ઠ પૃષ્ઠ પરના ડેટાની માત્રા ઘટાડવા વિશે છે :)). પરંતુ તમે અહીં અંતિમ GIF જોઈ શકો છો 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

કેક પર ચેરી

GIF ની તુલનામાં સાચવેલ બેન્ડવિડ્થની માત્રાને અનુભવીને આ લેખ સમાપ્ત કરવા માટે - તમામ વિડિઓઝનું કુલ કદ વધારે છે... 1.62 MB!! અધિકાર. કેટલાક અશ્લીલ 1,708,032 બાઇટ્સ! સરખામણી માટે, અહીં દરેક દ્રશ્ય માટે GIF અને AV1 વિડિયો માપો છે

GIF
AV1

દ્રશ્ય 1
11.7 એમબી
0.33 એમબી

દ્રશ્ય 2
7.27 એમબી
0.18 એમબી

દ્રશ્ય 3
5.62 એમબી
0.088 એમબી

ફક્ત અદભૂત! તે નથી?

ઉદાહરણ: VP9 અને H264 ની ફાઇલ કદ આપવામાં આવી નથી, કારણ કે સમાન બિટરેટના ઉપયોગને કારણે તેઓ વ્યવહારીક રીતે AV1 થી અલગ નથી. સમાન કદ સાથે વધુ બે કૉલમ ઉમેરવા માટે તે બિનજરૂરી હશે, ફક્ત તે પ્રકાશિત કરવા માટે કે આ કોડેક્સ ખૂબ નાની ફાઇલ કદમાં GIF કરતાં વધુ સારી ગુણવત્તા ઉત્પન્ન કરે છે.

સોર્સ: www.habr.com