WordPress-ի պատկերների օպտիմալացում

Նկարների օպտիմալացումը WordPress-ի կատարողականության ամենաբարձր եկամտաբեր ասպեկտներից մեկն է. նույն էջի կառուցվածքով և նույն թեման օգտագործելով՝ միայն պատկերի ֆայլի չափը, չափերը, ֆորմատը և փոխանցման մեթոդը ճիշտ ընտրելը հաճախ անմիջապես բարելավում է բեռման արագությունը։

Այնուամենայնիվ, պատկերների օպտիմալացումը նաև այն ոլորտն է, որտեղ ամենահեշտն է ամեն ինչ խառնաշփոթի վերածել; պատճառը ոչ թե տեխնոլոգիայի բարդությունն է, այլ տեղեկատվության չափազանց մասնատված լինելը:
Դուք կարդացել եք մի քանի հոդվածներ և տեղեկացել “կոմպրեսիա”, “WebP/AVIF” և “lazy loading” մասին, բայց երբ նայում եք պլագինի նկարագրությանը, այնտեղ գրված է “100 անվճար կրեդիտ ամսական”, “20MB անվճար” և “1 կրեդիտ մեկ պատկերի համար” — և որքան շատ եք կարդում, այնքան ավելի շփոթվում եք։ Արդյո՞ք անվճար թույլատրելիք բավարար է։ Ինչպե՞ս են հանվում վճարները։ Արդյո՞ք դուք սխալ եք հասկացել “նույն բանը”։ Եվ ամենակարևորը՝Արդյո՞ք դա իսկապես աշխատեց, երբ դու ավարտեցիր։

Այս հոդվածը անում է ընդամենը երեք բան։

1. Ահա մի պրակտիկ խորհուրդ։Ճանապարհային քարտեզ(Առաջին հերթին ինչ անել, հետո ինչ անել)
2. Խնդրում ենք մանրամասն բացատրել այն տարբերակները, որոնք դուք դիտարկում եք (ինչն է հստակ տարբերակում անվճար և վճարովի տարբերակները և ովքեր են դրանցից յուրաքանչյուրի համար առավել հարմար)
3. Ահա ամենատարածված թերությունները, նախապես թվարկված (որպեսզի ավարտելուց հետո ժամանակ չծախսեք դրանց որոնմանը և վերացնելուն)

1. Հիմունքներ: ինչ է ներառում WordPress-ը և ինչ չի ներառում

Եթե նախապես չհասկանաք, թե ինչ է արդեն արել WordPress-ի միջուկը, հավանական են երկու իրավիճակներ:

• Մեր տրամադրության տակ եղած “անվճար հնարավորություններից” օգտվելու փոխարեն մենք ժամանակն ու գումարը վատնեցինք անիվը նորից հայտնաբերելով։
• Ես կարծում էի, որ WordPress-ը “ավտոմատ կերպով կվերածի բոլոր հին պատկերները WebP/AVIF”, բայց պարզվեց, որ չի անում։

WordPress-ի միջուկը արդեն ներառում է այս հիմնական հատկությունները:

• Հարմարվող պատկերներ (srcset/sizes)WordPress 4.4-ից սկսած միջուկը կհայտարկի պատկերներ։ srcset 与 sizes... և օգտագործում է վերբեռման ընթացքում ստեղծված բազմաչափ պատկերները՝ թույլ տալու զննարկչին էկրանի պայմանների հիման վրա ընտրել և բեռնել առավել համապատասխան ռեսուրսները։
• Տեղայնացված ծույլ բեռնումWordPress 5.5-ից սկսած, պատկերների համար բնիկ ծույլ բեռնումը ըստ HTML ստանդարտների ակտիվացվում է նախնական կարգավորմամբ։ loading Գույքի իրականացում
• Աջակցում է WebP վերբեռումներինWordPress 5.8-ից սկսած՝ կարող եք ներբեռնել և օգտագործել WebP ֆայլերը նույն կերպ, ինչպես JPEG-ներն ու PNG-ները (եթե ձեր հոստինգի միջավայրը աջակցում է WebP-ին):
• Աջակցում է AVIF վերբեռումներինWordPress 6.5-ից սկսած՝ AVIF ֆայլերը կարելի է վերբեռնել և օգտագործել նույն կերպ, ինչպես JPEG և PNG ֆայլերը (կախված հյուրընկալող միջավայրի աջակցությունից):

Սակայն խնդրում ենք նկատի ունենալ՝
“Բեռնելու/օգտագործելու աջակցություն” ≠ “ավտոմատ փոխարկում/ավտոմատ առաքում”
Մյուս խոսքով՝ նույնիսկ եթե դուք արդեն WP 6.5-ում եք, ձեր մեդիա գրադարանում գտնվող JPG/PNG ֆայլերը ավտոմատ կերպով չեն փոխարկվի WebP/AVIF-ի, և դուք ավտոմատ կերպով չեք ստանա “AVIF/WebP ելք ապահովել՝ հիմնվելով զննարկչի հնարավորությունների վրա և չաջակցվող զննարկիչների դեպքում վերադառնալ սկզբնական պատկերին” ամբողջական ֆունկցիոնալությունը. սա սովորաբար պահանջում է հավելում կամ ծառայություն բացը լրացնելու համար։

2. Ճանապարհային քարտեզ. Պատկերի օպտիմալացման 5-քայլանի ուղեցույց

Ինչ անել, ինչու, ինչն է համարվում անցում և որոնք են ընդհանուր թերությունները։

2.1 Առաջին հերթին ճիշտ սահմանեք “չափերը” (ամենահեշտը անտեսել, սակայն ամենամեծ օգուտը բերողը)

Շատ կայքեր դանդաղ են ոչ թե այն պատճառով, որ դրանք օպտիմալացված չեն, այլ որովհետևՆերբեռնել է պատկեր, որը շատ ավելի մեծ է ցուցադրման տարածքից։：
Օրինակ, եթե էջը իրականում ընդամենը 900 պիքսել լայնություն ունի, բայց դուք ստիպում եք այցելուներին ներբեռնել բնօրինակ 3000 պիքսել լայնությամբ պատկերը, զննարկիչը պարզապես այն ներբեռնում է, ապա ցուցադրման համար փոքրացնում։ Սա վատնում է թողունակությունը, մեծացնում դեկոդավորման ժամանակը և դանդաղեցնում է առաջին էկրանի բեռման ժամանակը։

WordPress 4.4 և ավելի նոր տարբերակների համարՀարմարվող պատկերների մեխանիզմ（srcset/sizes) հատուկ նախագծված էր հենց այս խնդիրը լուծելու համար։

Ի՞նչ է համարվում անցում:

• Երբ էջը դիտվում է շարժական սարքում, ներբեռնված պատկերները պետք է նկատելիորեն փոքր լինեն, քան աշխատասեղանի վրա։
• Նույն պատկերի ֆայլի չափը տարբերվում է սարքի համաձայն (ոչ թե միշտ ներբեռնելով բնօրինակ պատկերը)

Ամենատարածված թերությունները:

• Որոշ թեմաներ կամ կոնստրուկտորներ պատկերները վերաբերում են որպես CSS ֆոնային պատկերներ կամ ցուցադրում դրանք յուրահատուկ ձևով, ինչը կարող է շրջանցել srcset, որի արդյունքում մեծ պատկերը շարունակում է բեռնվել
• Եթե օգտագործում եք արտաքին պատկերների հոստինգի ծառայություններ կամ երրորդ կողմի պատկերային բլոկներ, կարող եք շրջանցել մեդիա գրադարանի կողմից գեներացված բազմաչափ համակարգը։

---

2.2 Սեղմում (ֆայլի չափի նվազեցում առանց որակի կորուստի)

Կոմպրեսիայի էությունը ոչ թե “փոքրը լավ է”, այլ այն, որ “տարբերությունը գրեթե չի նկատվում մերկ աչքով, սակայն ֆայլի չափը զգալիորեն կրճատվում է”։

Կանոնները հետևյալն են:

• Լուսանկարներ/իրական կյանքի կադրեր (պորտրետներ, ապրանքներ, բնապատկերներ)Նախապատվություն տալ կորուստային կոմպրեսիային (առավելագույն օգուտ)
• Շատ տեքստ պարունակող էկրանահարումներ/նկարներԿիրառեք ավելի պահպանողական սեղմում՝ տեքստը մշուշ չերևալու համար։
• Լոգո/ԻկոնԱռաջնահերթություն տվեք SVG-ին կամ զգուշությամբ օգտագործեք առանց կորուստների կոմպրեսիա (կորուստային կոմպրեսիան հեշտությամբ կարող է առաջացնել եզրերի մշուշություն)

Ի՞նչ է համարվում անցում:

• Էջերի պատկերների մեծ մասի ֆայլի չափերը զգալիորեն կրճատվել են։
• Չկա նկատելի աղմուկ, եզրերի մշուշում, գունային գոտևորում կամ տեքստի մշուշում։

---

2.3 WebP / AVIF (Ֆորմատի քաղաքականություն՝ նույն մակարդակի հստակության համար փոքր ֆայլի չափ)

WordPress-ը այժմ աջակցում է ֆայլերի վերբեռնումին։ WebP (5.8) և AVIF (6.5)。
Այնուամենայնիվ, “հաջորդ սերնդի ֆորմատը” գործնական կիրառման մեջ դնելու համար սովորաբար անհրաժեշտ է լուծել երկու խնդիր:

1. Ինչպես զանգվածային կերպով փոխարկել պատմական մեդիա գրադարանը(Հակառակ դեպքում, դուք միայն օպտիմալացնելու եք “ապագայում վերբեռնվող նոր պատկերները”)
2. Պետք է պատճեն ստեղծե՞մ, թե՞ փոխարինե՞մ բնօրինակ պատկերը։(Սա կարևոր կետ է; հետագայում կկենտրոնանանք Plus WebP-ի “փոխարինել և ջնջել բնօրինակ պատկերը” ֆունկցիայի վրա։)

Խորհուրդ տրվող մոտեցում:

• WebP: ընդհանուր առմամբ նախնական ընտրություն (առաջարկում է ավելի հուսալի համատեղելիություն)
• AVIF: սեղմման ևս մեկ քայլ, որը հարմար է մեծ պատկերների, առաջին էկրանին մեծ պատկերների և պատկերասրահի պատկերների համար (բայց ավելիՇրջակա միջավայրի աջակցության վրա հենվող）

---

2.4 Օգտագործեք ծույլ բեռնումը ճիշտ (մի կիրառեք մեկ չափս բոլորին հարմար մոտեցում)

WordPress 5.5-ից սկսածՍտանդարտ թուլացած բեռնումՊատկեր
Այն նվազեցնում է սկզբնական ռենդերացման ժամանակ օգտագործվող թողունակությունը։

• Թուլ բեռնումը հարմար է էկրանից դուրս գտնվող ռեսուրսների համար։“
• Էջի վերին մասում գտնվող մեծ պատկերը (որը հաճախ առաջին էկրանին ամենակարևոր պատկերն է) ընդհանուր առմամբ հարմար չէ հետաձգված բեռնման համար։

---

2.5 Առաքման շերտ: CDN / Նկար CDN

Կոմպրեսիան, ֆայլի չափը և ֆորմատը բոլորն էլ նպատակ ունեն ֆայլերը դարձնել ավելի փոքր և ավելի հարմար։
Այնուամենայնիվ, եթե պատկերները անընդհատ բերվում են սկզբնական սերվերից երկար հեռավորություններից, ցանցային ուշացումը դեռևս զգալիորեն կազդի օգտվողի փորձի վրա։ Այսպիսի դեպքերում անհրաժեշտ է “առաքման շերտի” լուծում (CDN/image CDN)։

Երկու տիպիկ մոտեցումներ:

• Քլաուդֆլեյր Պոլանդիա：Cloudflare փաստաթղթավորումԱյս բաժինը ներկայացնում է պոլշերենում առկա կոմպրեսիայի մեթոդները (առանց կորուստների, կորուստային և WebP) և նշում է դրանց օգտագործումը format=auto Թույլատրվում են WebP և AVIF ֆորմատները։
• Ջեթփեք կայքի արագացուցիչ：Ջեթփեքի փաստաթղթավորումՍա նշանակում է, որ այն կօպտիմալացնի պատկերները և իր ցանցի միջոցով դրանք կբաշխի ստատիկ ռեսուրսների հետ միասին։

Նկարների օպտիմալացումը ապահովում է, որ նկարները փոքրանան և համապատասխան չափսեր ստանան։CDN: Ավելի մոտ և ավելի հուսալի առաքում

3. Մարշրուտի ընտրություն՝ հետևեք միայն երկու հիմնական երթուղիներին։

Նկարների օպտիմալացման ամենատարածված սխալը ոչ թե պլագին չտեղադրելն է, այլ չափազանց շատ պլագիններ տեղադրելը, ինչը հանգեցնում է կրկնակի մշակման:
A-ն կոմպրեսավորում է, B-ն նույնպես; A-ն փոխարկում է WebP/AVIF, B-ն նույնն է անում; A-ն փոխում է URL-ները, B-ն իրականացնում է URL-ների վերագրումներ — վերջում անգամ դու չես կարողանում գլուխ հանել, թե իրականում ինչ է կատարվում կայքում։

Կանոններ:

Պահպանեք մեկ մոտեցում՝ կամ ամբողջովին անվճար տեղական պահեստավորում, կամ ամպային կոմպրեսիայի երեք տարբերակներից մեկը։

• Route A (ամբողջովին անվճար տեղական)Բացի WebP կամ AVIF + EWWW Image Optimizer(կամ ընտրեք միայն մեկը)
• Բ տարբերակ (Ընտրեք երեք ամպային կոմպրեսիայի մեթոդներից մեկը):ShortPixel / Imagify / TinyPNG

---

3.1 Առաջին տարբերակ՝ ամբողջովին անվճար տեղական հոստինգ (WebP-ով կամ AVIF-ով կամ EWWW-ով)

Այս երթուղու հիմնական առանձնահատկություններն են՝

• Դուք չեք ապավինում երրորդ կողմի կոմպրեսիոն ծառայություններին, որոնք գանձում են ամսական քվոտայով կամ յուրաքանչյուր ֆայլի համար (չնայած որոշ ֆունկցիաներ կարող են մատչելի լինել որպես ընտրովի ծառայություններ)
• Թերությունն այն է, որ խմբային մշակումը կարող է ավելի մեծ բեռ դնել սերվերի վրա (1 TP յուրաքանչյուր 199 I/O-ի դիմաց), ինչը պահանջում է ավելի ուշադիր լինել “ռազմավարություն և ռիսկ” հարցերում։”

3.1.1 Պլյուս WebP կամ AVIFՀիմնական հասկացությունը “ստեղծում/փոխարինում” է; այն ավանդական իմաստով “կոմպրեսիոն գործիք” չէ։”

• Նկարների ամբողջական հավաքածու ստեղծելիս:Առաջնային պատկերի ֆայլի ID-ն կփոխարինվի WebP/AVIF ֆայլի ID-ով, սկզբնական ֆայլը կջնջվի, և բովանդակության մեջ առկա բոլոր URL հասցեները նույնպես կփոխարինվեն։。
• Պլագինը տրամադրում է WP-CLI հրամաններ և խորհուրդ է տալիս, որ WP-CLI-ն ավելի հուսալի է մեծ թվով ֆայլերի հետ աշխատելիս։

Սա նշանակում է՝ այն պարզապես “լուռ չի ստեղծում WebP ֆայլ ձեզ համար”, այլ կարող է լինելԳույքի փոխանցում(հատկապես եթե դուք միացրել եք “Փոխարինել և ջնջել բնօրինակը” տարբերակը)

Երկու ռեժիմների միջև տարբերությունը

Առաջին տարբերակ՝ պահպանել բնօրինակ պատկերը և ստեղծել WebP/AVIF պատճեններ (ավելի հուսալի)

• Առավելություն՝ համատեղելիության խնդիրներ առաջանալու դեպքում վերադարձնելը ավելի հեշտ է։
• Թերություն՝ սկավառակի օգտագործումը կաճի (սկզբնական պատկեր + նոր ֆորմատ + մի քանի մինիատյուրների չափեր)

Մեթոդ 2: Փոխարինել և ջնջել բնօրինակ պատկերը (ավելի արմատական)

• Առավելություններ: սկավառակը այնքան արագ չի լցվի; ներքին հղումները ավտոմատ կերպով փոխարկվում են նոր ֆորմատին
• Վտանգ: Եթե փոփոխեք և ակտիվները, և դրանց հղումները, համատեղելիության խնդիրների լուծումը ավելի ծախսատար կլինի (հատկապես այն դեպքերում, երբ արտաքին համակարգերը կամ թեմաների տրամաբանությունը հիմնված են սկզբնական ֆայլերի անունների, ուղիների կամ ձևաչափերի վրա):

WebP-ի կամ AVIF-ի ընդհանուր թերությունները

1. Ամբողջ գրադարանը փոխարինելուց հետո որոշ էջերում պատկերները սխալ են ցուցադրվում։
   Պատճառը սովորաբար ոչ թե “պատկերը կոտրված է”, այլ այն, որ շղթայի որևէ հատվածում ինչ-որ բան սխալ է գնացել՝ օրինակ URL-ի փոփոխություն, քեշավորում կամ մինիատյուրաների քաղաքականություն։
2. Քանի որ ավելի շատ նախադիտման պատկերակներ կան, այնքան ավելի մեծ է փոփոխությունների շրջանակը։
   WordPress-ում պատկեր վերբեռնելիս ստեղծվում են մի քանի չափսեր; թեմաներն ու պլագինները կարող են ավելացնել ևս ավելի շատ: Լիակատար փոխարինումը նշանակում է, որ դուք կարող եք փոփոխել շատ մեծ թվով ֆայլեր:
3. Միայն ֆորմատի փոխարկումը պարտադիր չէ, որ ապահովի ֆայլի ամենափոքր չափը։
   WebP և AVIF ֆայլերը սովորաբար ավելի փոքր են, սակայն չափերի որոշման և կոմպրեսիայի ռազմավարությունները շարունակում են մնալ կարևոր։ Մի վերաբերվեք Plus WebP-ին որպես մեկ սեղմումով լուծում արագ բեռման ժամանակների համար։

---

3.1.2 EWWW Image OptimizerԱնվճար տեղական կոմպրեսիայի առաջատար մատակարար

EWWW պլագինի էջը ունի շատ հստակ նպատակ:

• Այն կարող է օպտիմալացնել ձեր սերվերի պատկերները տարբեր գործիքների (jpegtran, optipng, pngout, pngquant, gifsicle, cwebp և այլն) միջոցով։
• Եթե ձեզ անհրաժեշտ է ավելի բարձր կոմպրեսիա կամ ցանկանում եք խնայել CPU-ի վրա, կարող եք նաև փոխանցել CPU սպառող մշակումը իրենց սերվերին (ընտրովի)։

Route A-ում EWWW-ն ինչ դեր պետք է խաղա?

Եթե դուք Plus WebP-ն օգտագործում եք “ֆորմատի միգրացիայի/փոխարինման ռազմավարության” համար, ապա EWWW-ն ավելի հարմար է դրա համար:

• Կոմպրեսիա և ծավալային օպտիմալացում(հատկապես հում ակտիվների, ինչպիսիք են JPG և PNG ֆայլերը, օպտիմալացումը)
• Պատմական մեդիա գրադարանի խմբային օպտիմալացում(Ուղղված է ծավալը նվազեցնելուն, ոչ թե URL-ը փոխարինելուն)

EWWW-ի տիպիկ թակարդ

1. Փաթեթային օպտիմալացման ընթացքում սերվերի բեռը մեծանում է։
   Սա պայմանավորված է նրանով, որ տեղային կոմպրեսիան մեկ 199 ՏԲ I/O-ի համար սպառում է 1 TP։ Լուծումը ոչ թե դրա օգտագործումը դադարեցնելն է, այլ տվյալները խմբաքանակներով մշակելը՝ ոչ պիկ ժամերին, և անհրաժեշտության դեպքում ընտրել օֆլոուդինգի կամ ամպային լուծումներ։
2. “WebP-ը գեներացվել է” պարտադիր չէ նշանակի, որ ֆրոնտենդը իրականում մատուցում է WebP։
   Շատ պլագիններ սխալ պատկերացում ունեն, որ գեներացիան մեկ բան է, իսկ առաքման ռազմավարությունները (օրինակ՝ վերագրումը, `picture` թեգերը և քեշի ժամկետի ավարտը)՝ բոլորովին այլ։
3. Կրկնօրինակում է մեկ այլ պլագինի ֆունկցիոնալությունը
   Եթե ընտրեք Ա տարբերակը, փորձեք խուսափել լրացուցիչ ամպային կոմպրեսիոն ծառայություններից, ինչպիսիք են ShortPixel-ը, Imagify-ը կամ TinyPNG-ը; եթե ընտրեք Բ տարբերակը, մի միացրեք Plus WebP-ում փոխարինման տրամաբանությունը: Հիմնական սկզբունքն է՝Պահպանեք մեկ գործողությունների պլան։

---

3.2 Բ տարբերակ՝ ընտրեք ամպային կոմպրեսիոն երեք ծառայություններից մեկը (ShortPixel / Imagify / TinyPNG)

Այս պլանը իդեալական է նրանց համար, ովքեր ցանկանում են խնայել սերվերի ռեսուրսները, նախընտրում են խմբային մշակման անհոգ մոտեցումը և հարմար են օգտագործման վրա հիմնված կամ “վճարիր ըստ օգտագործման” վճարման համակարգին։
Այնուամենայնիվ, ամպային սեղմման վերաբերյալ ամենատարածված սխալ պատկերացումը հետևյալն է՝Ազատ թույլտվությունը պարզապես “ազատ թերթիկների” հարց չէ։Փոքր պատկերների չափերի քանակը, WebP/AVIF ֆորմատների գեներացումը և պատկերների բազմակի սեղմումը բոլորը զգալի ազդեցություն կունենան ռեսուրսների օգտագործման վրա։

Ստորև մենք կբացատրենք՝ անվճար և վճարովի տարբերակների միջև տարբերությունը, ինչպես է կրեդիտը հանվում, ամենատարածված թերությունները, որոնցից պետք է խուսափել, և որ տեսակի կայքերն են առավել հարմար այս ծառայությունների համար։

---

3.2.1 ՇորտՊիքսելԱմսական 100 անվճար կրեդիտ, սակայն կրեդիտները սպառվում են մինիատյուրաների և WebP/AVIF մեծացումների համար։

Անվճար և վճարովի տարբերակների մասին ի՞նչ է խոսքը։

ShortPixel պլագինի նկարագրությունը հստակ նշում է՝

• Ամսական 100 անվճար կրեդիտ
• Կան նաև “ավելացված անսահմանափակ ամսական կրեդիտներ” (գնային մանրամասները ներկայացված են պլագինի էջում)
• Մենք նաև առաջարկում ենք “մեկանգամյա կրեդիտային փաթեթներ, որոնք երբեք չեն ավարտվում” (սկզբնական գների մասին տեղեկատվությամբ)

Նշում:

• Անվճար: Յուրաքանչյուր ամիս տրամադրվում է որոշակի քանակությամբ կրեդիտներ՝ թեթև կայքերում օգտագործելու կամ փորձարկման համար։
• Մեկանգամյա փաթեթ։ Հարմար է այն կայանների համար, որոնք ունեն մեծ մեդիա գրադարան և ցանկանում են մեկանգամայն մաքրել իրենց պաշարները (գնվում է մեկ անգամ և գործում է մինչև սպառվելը; սովորաբար ժամկետ չունի)
• Ամսական/Անսահմանափակ՝ հարմար է այն կայանների համար, որոնք պահանջում են կանոնավոր պատկերների թարմացումներ և երկարաժամկետ, կայուն օպտիմալացում։

ShortPixel-ի պաշտոնական գիտելիքների բազան նաև առաջարկում է ուղեցույց “մեկանգամյա լիցենզիա ընդդեմ անսահմանափակ ամսական” թեմայով։Հստակ բացատրությունԱնսահմանափակ ամսական պլանը հաշվարկվում է ամսական (կամ տարեկան), առաջարկելով անսահմանափակ կրեդիտներ և հաստատուն CDN քվոտա; մեկանգամյա կրեդիտները չեն ավարտվում, ինչը ձեզ տալիս է ավելի մեծ վերահսկողություն օգտագործման նկատմամբ՝ ըստ անհրաժեշտության։

Ամենակարևորը՝ ինչպես են հաշվարկվում ShortPixel կրեդիտները?

ShortPixel պաշտոնական փաստաթղթավորում KB-ն շատ կոպիտ ձևով ասաց։

• Երբ WordPress-ում պատկեր եք վերբեռնում, այն ստեղծում է մի քանի մինիատյուրներ։
• Յուրաքանչյուր մինիատյուրայի օպտիմալացումը հաշվվում է որպես մեկ կրեդիտ։；
• Եթե ընտրեք WebP կամ AVIF ստեղծել,Յուրաքանչյուր WebP կամ AVIF տարբերակը բնօրինակ պատկերի և դրա մինիատյուրան կհաշվվեն որպես լրացուցիչ կրեդիտ։；
• Դուք կարող եք բացառել որոշ թումբնեյլներ օպտիմալացումից՝ կրեդիտների օգտագործումը նվազեցնելու համար։

վարկային օրինակ：

Պատկերացրեք, որ վերբեռնում եք մեկ պատկեր, և թեման կամ պլագինը ստեղծում է ութ մինի պատկերներ:

• Օպտիմալացրեք միայն բնօրինակ պատկերը և մինիատյուրները՝ 1 (բնօրինակ պատկեր) + 8 (մինիատյուրներ) = 9 կրեդիտ
• Եթե դուք նույնպես ցանկանում եք գեներացնել WebP/AVIF՝ ավելացրեք յուրաքանչյուր վերոհիշյալ 9-ին հաջորդ սերնդի տարբերակ → ևս 9 կրեդիտ
  Մյուս խոսքով, կարող եք մտածել, որ դա “մեկ պատկեր” է, սակայն իրականում դրա արժեքը կարող է կազմել գրեթե “երկանիշ կրեդիտներ”։

Ուստի:“100 անվճար կրեդիտներ” չի նշանակում “100 անվճար պատկերներ”։

ShortPixel-ի ամենատարածված թերությունները

1. Անվճար 100 կրեդիտները շուտով կավարտվեն
   Պատճառը՝ մեծ թվով թումբնեյլներ + WebP/AVIF ֆայլեր ստեղծելու համար հավելյալ կրեդիտներ։
   Խորհուրդ：

• Առաջին հերթին գնահատեք կայքի թումբնեյլների քանակը։
• Հեռացրեք անպետք մինիատյուրների չափերը (օպտիմալացրեք միայն այն չափերը, որոնք իրականում կօգտագործվեն)
• Նախ որոշեք կոմպրեսիայի ռազմավարությունը, ապա գործընթացը բաժիններով իրականացրեք՝ փորձարկում-սխալների վրա ժամանակ չվատելու համար։

2. Օգտագործեք այլ ֆորմատի փոխարկման պլագինների հետ միասին
   Եթե միացնեք Plus WebP փոխարինումը և թույլ տաք ShortPixel-ին ստեղծել և ներդնել հաջորդ սերնդի թեգեր, տրամաբանությունը կկրկնվի, ինչը դժվարացնում է խնդիրների լուծումը։ B տարբերակի դեպքում ShortPixel-ը ինքնուրույն է իրականացնում այս առաջադրանքը։
3. Ես ենթադրում էի, որ տեղադրվելուց հետո ֆրոնթենդը ավտոմատ կերպով կստեղծի WebP/AVIF ֆայլեր։“
   ShortPixel պլագինի էջըԱյն կարող է փոխարկել WebP և AVIF ֆայլերը և ներառել հաջորդ սերնդի պատկերներ ֆրոնտենդային էջերում (օրինակ՝ թեգերի միջոցով):
   Այնուամենայնիվ, երբ ավարտեք, պետք է ստուգեք արդյունքները։

---

3.2.2 Իմաջիֆայ: Ամսական 20MB անվճար; քվոտան հաշվարկվում է՝ հիմնվելով “սկզբնական պատկերի չափ + թումբնեյլերի քանակ”; կրկնակի վերբեռնումները կհանգեցնեն կրկնակի հանումների

Ազատ հատկացում և գտնվելու վայր

Imagify-ի պաշտոնական գների էջըԴա բավականին հստակ նշված է։Անվճար հաշիվները ունեն ամսական 20MB քվոտա։。
Նրա պլագինի էջում նույնպես նշվում է, որ այն կարող է կոմպրեսավորել, չափափոխել և փոխարկել WebP/AVIF։

Քվոտան ինչպես է հանվում?

Imagify պաշտոնական փաստաթղթավորում “Ինչպե՞ս է հաշվարկվում քվոտայի օգտագործումը?” բաժնում շատ հստակ բացատրվում է հաշվարկման մեխանիզմը։

• Թումբնեյլների քանակը ազդում է ռեսուրսների օգտագործման վրաՕրինակ, եթե ունեք 10 թումբնեյլ չափսեր, մեկ պատկերի օպտիմալացումը կհանգեցնի 11 պատկերների օպտիմալացման (սկզբնական պատկերը և 10 թումբնեյլներ), որոնք բոլորը կհաշվվեն ձեր քվոտայում։
• Նվազեցրեք քվոտան՝ հիմնվելով սկզբնական ֆայլի չափի վրաՕրինակ, եթե դուք Imagify-ում վերբեռնեք 100 KB նկար, ձեր քվոտայից կհանվի 100 KB։
• Կոմպրեսիայի մակարդակի փոփոխությունն ու կրկնակի օպտիմալացումը կրկին կծախսի քվոտան։。
• Մեկ API-клюչը կարելի է օգտագործել մի քանի կայքերում, սակայն քվոտան դրանց միջև կիսվում է։

Սա Imagify-ի “հիմնական մոտեցումն” է։
Սա ավելի շուտ տվյալների փաթեթ է՝ որքան շատ բեռնեք, այնքան շատ տվյալներ կծախսի; որքան շատ թումբնեյլներ ստեղծեք, այնքան շատ տվյալներ կծախսի; և եթե ֆայլերը բազմիցս կրկնակի սեղմեք, այն կրկին ու կրկին տվյալներ կծախսի։

Imagify-ի քվոտաների հեշտ հասկացվող օրինակ

Պատկերացրեք, որ դուք վերբեռնում եք 800 KB չափի բնօրինակ պատկեր, և կայքը ստեղծում է 8 փոքր պատկեր։

• Imagify-ով օպտիմալացնելիս “օրիգինալ պատկերը և 8 մինիատյուրները” ներառվում են (եթե ընտրեք “Բոլորը օպտիմալացնել”), ինչը նշանակում է, որ այս գործողությունը կծախսի քվոտա, որը գրեթե հավասար է բոլոր այս ֆայլերի ընդհանուր չափին։
  Սա է պատճառը, որ որոշ կայքերում “20MB” քվոտան արագ սպառվում է. խնդիրը ոչ թե Imagify-ի անբավարարությունն է, այլ այն, որ դուք վերբեռնում եք չափազանց մեծ պատկերներ, ստեղծում չափազանց շատ մինի պատկերներ և, հավանաբար, բազմիցս փորձարկում տարբեր կոմպրեսիայի մակարդակներ։

Imagify-ի ամենատարածված թերությունները

1. Անվճար 20MB-ը բավարար չէ “ամբողջ կայքի պատմության մաքրում” իրականացնելու համար։”
   20MB-ն ընդհանուր առմամբ ավելի հարմար է թեստավորման և փոքր թարմացումների համար; եթե ձեր մեդիա գրադարանը արդեն մեծ է, այն մեկանգամայն մաքրելու համար, ամենայն հավանականությամբ, անհրաժեշտ կլինի արդիականացում։
2. Կոմպրեսիայի մակարդակը բազմիցս կարգավորելը հանգեցնում է քվոտայի բազմիցս սպառմանը։
   Imagify: պարզ բացատրությունՎերօպտիմալացումը կրկին կծախսի քվոտան։
   Մենք խորհուրդ ենք տալիս այս էջում հստակ ներկայացնել “ռազմավարությունը”:

• Սկսեք օգտագործել մի քանի պատկեր՝ կոմպրեսիայի մակարդակը և տեսողական որակը որոշելու համար։
• Երբ ռազմավարությունը վերջնական տեսքի է հաղորդվել, կիրականացնեք այն խմբաքանակներով։
  Խուսափեք ամբողջ տվյալների բազայում փորձարկում-սխալների մեթոդից։

3. Մեկ API-клюչը մի քանի կայքերում կիսելը հանգեցնում է քվոտաների “գաղտնի նվազմանը”
   Եթե նույն API-клюչը օգտագործեք մի քանի կայքերում, քվոտաները կկիսվեն։
   Ուստի թիմային կամ բազմակայանային սցենարներում լավագույնն է պարզաբանել, թե որ կայաններն են ռեսուրսներ կիսում, և որոնք են գործում անկախ, որպեսզի խուսափել բյուջեի գերազանցումներից։

---

3.2.3 Թայնի Փի Էն Ջեյ(Tiny Compress Images). Ամսական 500 անվճար կրեդիտ; WebP/AVIF-ի փոխարկումը ենթադրում է հավելյալ 1 կրեդիտ մեկ չափի համար։“

Ազատ տրվող նպաստներ և դրանց հաշվարկման եղանակները

TinyPNG WordPress պլագինի էջը շատ հստակ է գրված։

• Ամսական 500 անվճար կրեդիտ
• Ստանդարտ WordPress տեղադրման դեպքում, հավանաբար, կարող եք կոմպրեսացնել Ամսական մոտավորապես 100 պատկեր
• Այնուամենայնիվ, եթե AVIF կամ WebP փոխարկումը միացված է:Յուրաքանչյուր պատկերի չափը կարժենա մեկ հավելյալ կրեդիտ։, ուստի, կարծում եմ, միակ տարբերակը դրա կոմպրեսավորումն ու փոխարկումն է։ Մոտավորապես 50 պատկեր ամսական(Կախված է, թե քանի մինիատյուրի չափեր ունեք։)

Մինչդեռ Tinify-ն (TinyPNG-ի և TinyJPG-ի մշակողը) նույնպես API գների էջԽնդրում ենք նկատի ունենալ՝ գրանցվեք՝ ամսական 500 անվճար կոմպրեսիա ստանալու համար; սահմանը գերազանցելու դեպքում վճարում կիրականացվի հաջող կոմպրեսիաների թվի հիման վրա, առանց պարտադիր բաժանորդագրության։

Մեկ նախադասությամբ ամփոփելու համար, թե ինչպես է աշխատում TinyPNG-ը:
Այն հաշվարկվում է կրեդիտներով. որքան շատ մինիատյուրների չափեր օգտագործեք և որքան շատ WebP/AVIF-ը ակտիվացնեք, այնքան արագ կծախսվեն ձեր կրեդիտները։

TinyPNG կրեդիտների հեշտ հասկանալի օրինակ

Պատկերացրեք, որ ձեր կայքը յուրաքանչյուր պատկերի համար ստեղծում է ութ մինի պատկերի չափսեր:

• Միայն կոմպրեսիա՝ բնօրինակ պատկեր + 8 մինիատյուրներ → պահանջվում է 9 կրեդիտ
• Եթե WebP/AVIF փոխարկումը միացված է՝ յուրաքանչյուր չափի համար կհանվի հավելյալ կրեդիտ → ինչը կարող է գրեթե կրկնապատկել ընդհանուր գումարը
  Սա համապատասխանում է պլագինի էջում տրված նկարագրությանը. երբ փոխարկումը միացված է, անվճար քվոտան փոխվում է մոտավորապես “100 ամսական”–ից “50 ամսական”։

TinyPNG-ի ամենատարածված թերությունները

1. Ես կարծում էի, որ 500 կրեդիտը նշանակում է 500 պատկեր։
   Ոչ։ Այն գանձվում է ըստ “նկարի չափի/տարբերակի”։ Պլագինի էջում հստակ նշվում է, որ “փոխարկումը յուրաքանչյուր նկարի չափի համար կարժենա լրացուցիչ 1 կրեդիտ”։
2. Թեմայի/էլեկտրոնային առևտրի պլագինը շատ մեծ թվով պատկերի չափեր է ստեղծում, և անվճար քվոտան զգալիորեն կրճատվել է։
   Որքան շատ չափեր կան, այնքան ավելի հեշտ է կրեդիտների սպառվելը։
3. Փոխարկումը ակտիվացնելուց հետո պարզեցի, որ իմ վարկային սահմանաչափը հանկարծ սպառվել է։
   Սա սխալ չէ; սա հաշվարկման համակարգի աշխատանքի սկզբունքն է։
   Ռազմավարական առաջարկություններ:

• Եթե անվճար փուլը հիմնականում նախատեսված է կոմպրեսիայի և քաշի նվազեցման համար, կարող եք սկսել պարզապես կիրառելով կոմպրեսիա։ Երբ հաստատեք, որ կայքի կառուցվածքը կայուն է և իսկապես ձեզ անհրաժեշտ է հաջորդ սերունդը, կարող եք սկսել փոխարկումը։

4. Սցենարների ըստ առաջարկություններ՝ ինչպես ընտրել տարբեր տեսակի կայքերի համար

Չնայած բոլորը օգտագործում են WordPress, պատկերների հետ կապված խնդիրները տարբերվում են բովանդակային կայքերի, էլեկտրոնային առևտրի կայքերի, պորտֆոլիոների և անդամակցային կայքերի միջև։

4.1 Բովանդակային կայքեր/բլոգներ (ներառում են բազմաթիվ պատկերներ և հոդվածներ, միջին թարմացման հաճախականությամբ)

Առաջնահերթ առաջարկություններ:

1. Չափորոշման ռազմավարություն (քայլ 1)
2. Կոմպրեսիա (քայլ 2)
3. WebP (քայլ 3)

Ավելի հարմար երթուղի:

• Եթե ցանկանում եք առանց խնդիրների տարբերակ՝ ընտրեք B տարբերակի երեքից մեկը (ShortPixel / Imagify / TinyPNG)
• Եթե ցանկանում եք անվճար տարբերակ՝ ընտրեք A երթուղին (Plus WebP + EWWW), սակայն առաջարկում ենք սկսել “Պահպանողական ռեժիմով (չհեռացնել բնօրինակ պատկերները)”, որպեսզի նախ գնահատեք ռիսկերը։

Հաճախ հանդիպող թերություններ:

• Հոդվածի էջի վերնագրային պատկերը շատ մեծ է, և ծույլ բեռման ռազմավարությունը վատ է իրականացված։Այն դանդաղեցնելու է առաջին էկրանը։

4.2 Էլեկտրոնային առևտրի/արտադրանքի կայքեր (ներկայացնում են բազմաթիվ մինիատյուրներ և պատկերների տարբերակներ; կայունությունը գերակա է)

Էլեկտրոնային առևտրում ամենատարածված խնդիրները ոչ թե “կոմպրեսիայի որակը թույլ է”, այլ այն, որ օպտիմալացումից հետո որոշ չափեր սխալ են, թումբնեյլները բացակայում են կամ ֆրոնթ-ենդի բաղադրիչները չեն կարողանում ստանալ պատկերները։

Առաջնահերթ առաջարկություններ:

1. Սկսեք զգուշությամբ՝ որդեգրեք պահպանողական կոմպրեսիայի ռազմավարություն; մի՛ փոխարինեք ամբողջ տվյալների բազան անմիջապես։
2. Մինիատյուրաների չափերի գնահատում։ Էլեկտրոնային առևտրի թեմաները սովորաբար ստեղծում են ավելի շատ չափեր, ինչը կարող է զգալիորեն մեծացնել տվյալների օգտագործումը (այսը հատկապես նկատելի է ShortPixel-ի և TinyPNG-ի դեպքում)։
3. Նախ իրականացրեք փոքրածավալ փորձարկում, ապա տարածեք այն ավելի լայն լսարանի վրա (այսը անչափ կարևոր է)

Ավելի հարմար երթուղի:

• Բ տարբերակը սովորաբար առանց խնդիրների ընտրությունն է՝ ShortPixel-ը, Imagify-ն և TinyPNG-ն բոլորը աջակցում են խմբային մշակմանը; կարևորն է հասկանալ քվոտաների համակարգը և նախապես գնահատել ծախսերը։
• Առաջին տարբերակը նույնպես ընդունելի է, սակայն Plus WebP-ի ID-ների գերագրման, բնօրինակ պատկերների ջնջման և URL-ների փոխարինման վարքագծի առումով պետք է ավելի զգույշ լինեք։ Քանի որ սա ակտիվների միգրացիա է, խորհուրդ չի տրվում անմիջապես կատարել ամբողջական փոխարինում։

4.3 Պորտֆոլիոներ/ֆոտոգրաֆիայի կայքեր (որտեղ պատկերի որակը վճռորոշ է, ֆայլերը մեծ են, և տեսողական գրավչությունը առավելագույն կարևորություն ունի)

Առաջնահերթ առաջարկություններ:

1. Չափորոշման ռազմավարություն (ցուցադրման տարածքի վերահսկում)
2. Կոմպրեսիայի ռազմավարություն (ավելի լավ է ունենալ մի փոքր ավելի մեծ ֆայլ, քան կորցնել մանրամասները)
3. WebP/AVIF (մեծ պատկերների դեպքում առավելությունները ակնհայտ են, սակայն տեսողական որակը պետք է ստուգվի)

Ավելի հարմար երթուղի:

• ԻմաջիֆայՔանի որ քվոտան հանվում է ելնելով “սկզբնական պատկերի չափից”, այսպիսի կայքը հեշտացնում է ծախսերը վերահսկել (դուք մոտավորապես գիտեք, թե որքան կարժենա յուրաքանչյուր մեծ պատկերը), սակայն պետք է խուսափել դրանց կրկնակի կոմպրեսավորումից։
• ՇորտՊիքսելԵթե մինիատյուրների չափսերը շատ չեն, կրեդիտների օգտագործումը բավականին պարզ է; սակայն եթե ստեղծեք մեծ թվով չափսեր և հաջորդ սերնդի տարբերակներ, կրեդիտների ծախսը զգալիորեն կաճի, ուստի պետք է նախապես պլանավորել։

5. Քվոտա ընդդեմ հաշվարկի. մանրամասն վերանայում՝ արդյոք անվճար թույլատրելի չափը բավարար է

Որն է առաջարկում ավելի լավ արժեք գումարի դիմաց, և որքան կտևի անվճար փորձարկման ժամկետը?

5.1 Երեք հաշվարկային մոդելներ

• ՇորտՊիքսել(վարկեր)Քրեդիտները հաշվարկվում են՝ հիմնվելով “սկզբնական պատկերը պլուս մինիատյուրների քանակը” սկզբունքի վրա։ WebP/AVIF ֆայլերի գեներացումը յուրաքանչյուր համապատասխան տարբերակի համար կհանգեցնի հավելյալ քրեդիտի գանձման։
• Իմաջիֆայ(MB քվոտա)Քվոտան հանվում է ըստ “սկզբնական ֆայլի չափի”; որքան շատ են թումբնեյլերը, այնքան ավելի շատ քվոտա է օգտագործվում; կրկնակի կոմպրեսիան կհանգեցնի լրացուցիչ քվոտայի հանումների։
• Թայնի Փի Էն Ջեյ(վարկեր): 500 կրեդիտ ամսական; WebP/AVIF փոխարկման միացումը կհանգեցնի հավելյալ վճար յուրաքանչյուր պատկերի չափի համար։

5.2 Արագ գնահատման մեթոդներ

Դուք կարող եք այն գնահատել հետևյալ կերպ՝

1. Ընտրեք որևէ “օրիգինալ պատկեր, որը հաճախ եք վերբեռնում”, և ստուգեք դրա մոտավոր չափը (օրինակ՝ 300KB / 1MB / 3MB)
2. Դա կախված է նրանից, թե ձեր կայքը սովորաբար քանի մինիատյուրային չափ է ստեղծում (օրինակ՝ 5, 10 կամ 20)
3. Վճռեք՝ արդյոք ցանկանում եք գեներացնել WebP/AVIF (Այո/Ոչ)

Այնուհետև օգտագործեք ստորև բերված “մտավոր հաշվարկը”՝ սպառումը հասկանալու համար:

• ՇորտՊիքսելՅուրաքանչյուր պատկեր համարժեք է (1 + մինիատյուրների քանակ) կրեդիտների; եթե գեներացվում է WebP/AVIF, ապա կրկնապատկվում է (քանի որ հաջորդ սերնդի տարբերակները նույնպես պահանջում են կրեդիտներ)
• ԻմաջիֆայՅուրաքանչյուր պատկերի համար նախատեսված քվոտան մոտավորապես հավասար է (սկզբնական պատկերի չափը + բոլոր մինի պատկերակների ընդհանուր չափը); սեղմման մակարդակի փոփոխությունն ու պատկերի կրկնակի սեղմումը կհանգեցնի քվոտայի հետագա նվազեցման։
• Թայնի Փի Էն Ջեյ500 անվճար կրեդիտ; եթե ձեր կայքը մեկ պատկերի համար գեներացնում է մեծ թվով պատկերի չափսեր և պատկերի փոխարկումը միացված է, անվճար պատկերների քանակը զգալիորեն կկրճատվի (պլագինի էջը տալիս է մոտավոր գնահատական՝ “ամսական մոտ 100” և “ամսական մոտ 50”)

6. Ռիսկերի բացահայտում

Ռիսկ 1. Խուսափեք նույն առաջադրանքը կատարող մի քանի պլագիններ ունենալուց

Սա աղետի ամենատարածված աղբյուրն է։“

• Մարշրուտ A:Բացի WebP կամ AVIF + EWWW(Բաժանեք առաջադրանքները երկուսի միջև; միևնույն ժամանակ մի իրականացրեք և՛ փոխարկումը, և՛ առաքումը, կամ տեղադրեք դրանցից միայն մեկը)
• Բ տարբերակ՝ ShortPixel / Imagify / TinyPNG Ընտրեք երեքից մեկը։(Ընտրեք մեկը՝ կոմպրեսիան և հաջորդ սերունդը կառավարելու համար)

Ռիսկ 2: Բացի WebP-ի “ID-ի գերագրում / բնօրինակ պատկերի ջնջում / URL-ի փոխարինում” ֆունկցիաները կազմում են ակտիվների միգրացիա։

Կրկնելու համար:Պլյուս WebP Նկարագրությունը հստակ նշում է, որ մեկ ամբողջական գեներացիայի ընթացքում սկզբնական պատկերի ID-ն կփոխարինվի, սկզբնական ֆայլը կհեռացվի, և բովանդակության URL-ը կփոխարինվի։
Սա նշանակում է, որ դա ոչ թե “փոքր կարգավորում է, որը ցանկացած պահի կարելի է հետ շրջել”, այլ ակտիվի մակարդակի փոփոխություն է։

Խորհուրդ տրվող ռազմավարությունը պետք է լինի՝

• Սկսեք փոքրածավալ թեստով (մի քանի տասնյակից մինչև մի քանի հարյուր)
• Հաստատեք, որ ֆրոնտենդի ցուցադրումը, թումբնեյլները և քեշի թարմացումները բոլորը ճիշտ են աշխատում։
• Դիտարկեք ամբողջ տվյալների բազայի մշակումը

Ռիսկ 3: ամպային կոմպրեսիայի “անվճար քվոտայի” իրական սպառումը կախված է թումբնեյլների քանակից և հաջորդ սերնդի տարբերակների ընտրությունից

• ՇորտՊիքսելՓոքր պատկերակները և հաջորդ սերնդի առանձնահատկությունները զգալի ազդեցություն կունենան վարկային տողերի վրա։
• Թայնի Փի Էն ՋեյWebP/AVIF-ի միացումը կհանգեցնի հավելյալ կրեդիտի նվազեցման յուրաքանչյուր պատկերի չափի համար։
• ԻմաջիֆայՎճարները հաշվարկվում են ըստ սկզբնական պատկերի չափի; որքան շատ են մինիատյուրաները, այնքան բարձր է վճարը; կրկնակի ներբեռնումները կհանգեցնեն հավելյալ վճարների

Վտանգ 4: “WebP/AVIF-ը գեներացվել է” չի նշանակում, որ “ֆրոնտենդը մատուցում է WebP/AVIF”

Շատերը կարծում են, որ փոխարկումից հետո իրենց կայքը չի արագացել; հիմնական պատճառը այն է, որ front-end-ը դեռ մատուցում է JPG/PNG ֆայլեր (caching-ի, rewriting-ի, tags-ի կամ browser negotiation-ի անհամապատասխանության պատճառով):

7. Ինչպե՞ս ստուգեմ, որ այն ուժի մեջ է մտել, երբ ավարտեմ։

4 շատ պարզ ստուգակետեր:

1. Նույն էջը երկրորդ անգամ թարմացնելիս բեռման գործընթացը ավելի կայուն և արագ է՞(Որքան նկատելի են քեշավորման և օպտիմալացման ազդեցությունները?)
2. Կա՞ նկատելի տարբերություն բջջային սարքերում և աշխատասեղանի համակարգիչներում բեռնված պատկերների չափերի միջև։(Պատասխանող աղբյուրների հավաքածու/չափեր (աշխատո՞ւմ է արդյոք)
3. Պատահականորեն ստուգեք մի քանի պատկեր՝ արդյոք կան WebP կամ AVIF ֆայլեր/ռեսուրսներ։(Կայքը իսկապես օգտագործո՞ւմ է հաջորդ սերունդ）
4. Նայեք մի քանի պատկերների վրա՝ մեծացրեք դրանք, որպեսզի տեսնեք՝ արդյոք դրանք նկատելիորեն մշուշ են, թե տեքստը թվացյալ մշուշ է։(Կոմպրեսիան չափազանց ուժեղ է՞)

Եթե այս չորսն էլ կիրառելի են, դա նշանակում է, որ ձեր ընտրած երթուղին արդեն գործարկված է։ Հաջորդը անցեք CDN “Առաքման շերտ”...ընդհանուր առմամբ այն ավելի կայուն կլինի։

8. Գործողությունների առաջարկություններ

1. Առաջին հերթին ընտրեք երթուղի:

• Ես կցանկանայի այն հնարավորինս անվճար պահել։: Plus WebP կամ AVIF + EWWW (կամ տեղադրել դրանցից միայն մեկը)
• Ցանկանու՞մ եք խնայել սերվերի ռեսուրսները։ Օգտագործման համար վճարելը ավելի անհոգ է։Ընտրեք ShortPixel-ը, Imagify-ը կամ TinyPNG-ը։

2. Սկսեք փոքրածավալ թեստով (մի քանի տասնյակ)
3. Մինչ խմբաքանակներով մշակելը ստուգեք, որ ամեն ինչ կարգին է։
4. Առաքման հուսալիությունը պետք է ավելի բարելավվի։Կարդալ CDN արագացում

Հաճախակի տրվող հարցեր

1. Քանի պլագին պետք է տեղադրեմ? Կարո՞ղ եմ դրանք բոլորը տեղադրել?

Փորձեք մնալ մեկ երթուղու վրա։

• Առաջին տարբերակ՝ WebP կամ AVIF + EWWW Image Optimizer (կամ տեղադրել դրանցից միայն մեկը)
• Բ տարբերակ՝ ընտրեք ShortPixel-ը, Imagify-ը կամ TinyPNG-ը։
  Մեկ կայքում միաժամանակ մի քանի պլագիններ օգտագործելը՝ “կոմպրեսիա, WebP կամ AVIF ֆորմատի փոխարկում, URL-ի փոփոխություն և առաքման վերակազմավորում” իրականացնելու համար, ամենաապահով միջոցն է խառնաշփոթ ստեղծելու և ամենաբարդը՝ այն շտկելու համար։

2. Արդյո՞ք WordPress-ը արդեն չի աջակցում WebP/AVIF-ին։ Արդյո՞ք ինձ դեռ անհրաժեշտ է պլագին։

Կարևոր է տարբերակել հետևյալը՝
“Բեռնելու/օգտագործելու աջակցություն” ≠ “ավտոմատ փոխարկում/ավտոմատ առաքում”
WordPress 6.5-ը ավտոմատ կերպով չի փոխարկի առկա JPG/PNG ֆայլերը WebP/AVIF ձևաչափերի զանգվածային փոխարկման միջոցով, և չի իրականացնի ամբողջ գործընթացը՝ “AVIF/WebP մատուցելը՝ հիմնվելով զննարկչի հնարավորությունների վրա և հետ վերադառնալով սկզբնական ձևաչափին”: Ձեր առկա մեդիա գրադարանը նույնպես թարմացնելու համար սովորաբար անհրաժեշտ է օգտագործել պլագին կամ ծառայություն՝ բացերը լրացնելու համար։

3. Երբ խոսքը պատկերների օպտիմալացման մասին է, որն է այն քայլը, որը իրականում ապահովում է ամենաբարձր ներդրումային վերադարձը?

Սովորաբար Նախ ճիշտ սահմանեք չափերը (srcset/sizes)。
Շատ կայքեր դանդաղ են ոչ թե այն պատճառով, որ չեն կոմպրեսացվել, այլ որովհետև ցուցադրում են միայն 900 պիքսել լայնությամբ էջ, մինչդեռ օգտվողներին ստիպում են ներբեռնել բնօրինակ 3000 պիքսել լայնությամբ պատկերը։ Կոմպրեսիան կարող է խնայել մի քանի կիլոբայթ, սակայն “սխալ չափերը” ստիպում են ձեզ անհիմն ներբեռնել տվյալների մի քանի անգամ ավելի մեծ ծավալ։

4. Ինչպե՞ս կարող եմ համոզվել, որ բեռնվում է “փոքր տարբերակը”, այլ ոչ թե բնօրինակ պատկերը։

Դիտարկեք երկու երևույթներ:

• Մոբայլ սարքում դիտելիս ներբեռնված պատկերները նկատելիորեն փոքր են, քան աշխատասեղանի վրա։
• Նույն պատկերի ֆայլի չափը տարբերվում է՝ կախված այն սարքից, որի վրա այն բեռնված է։
  Եթե պատկերները միշտ ներբեռնվում են իրենց բնօրինակ չափսով, դա հաճախ պայմանավորված է նրանով, որ թեման կամ էջերի կառուցողը պատկերը վերաբերվում է որպես CSS ֆոնային պատկեր կամ հատուկ ելք, այդպիսով շրջանցելով մեդիա գրադարանի բազմաչափ աջակցությունն ու `srcset` հատկությունը։

5. “WebP/AVIF generated” արտահայտությունը պարտադիր՞ է նշանակում, որ ֆրոնտենդը WebP/AVIF է արտածում։

չի հավասար
Գեներացումը ամբողջական է միայն “ֆայլի մակարդակում”; WebP/AVIF-ը իրականում առջևի կողմին մատուցվո՞ւմ է, կախված է այնպիսի գործոններից, ինչպիսիք են վերագրումը, `picture` թեգի ռազմավարությունը, cache-ի կիրառումը և զննարկչի բանակցությունների արդյունավետությունը։ Երբ ավարտեք, պետք է պատահական ստուգեք մի քանի պատկերների ռեսուրսների տեսակները։

6. Ի՞նչ ռիսկեր են կապված WebP-ի կամ AVIF-ի հետ։ Կարո՞ղ եմ մեկ սեղմումով ստուգում անցկացնել ամբողջ տվյալների բազայի վրա։

Վտանգը ոչ թե “կոմպրեսիայում” է, այլԳույքի միգրացիայի մակարդակների փոփոխություններ：

• Ամբողջ հավաքածուն գեներացնելիս սկզբնական պատկերի ֆայլերի ID-ները կարող են գերագրվել, սկզբնական ֆայլերը կարող են ջնջվել, և բովանդակության մեջ առկա URL-ները կարող են փոխարինվել։
  ԱյսպիսովՄենք չենք խորհուրդ տալիս ամբողջ տվյալների բազան անմիջապես փոխարինել։Սկսեք փոքրածավալ թեստով (մի քանի տասնյակից մինչև մի քանի հարյուր գրառում) և համոզվեք, որ լիարժեք տվյալների բազայի հետ աշխատելուց առաջ ունեք աշխատող պահուստային պատճեն։

7. Ինչպե՞ս ընտրեմ Plus WebP-ի երկու ռեժիմների միջև՝ պահպանե՞լ բնօրինակ պատկերը, թե՞ փոխարինել և ջնջել այն։

Պարզ ասած՝

• Առաջին տարբերակ՝ պահպանել բնօրինակ պատկերը և ստեղծել WebP/AVIF պատճեններ (ավելի հուսալի)Հեշտ է վերադարձնել, սակայն պահանջում է ավելի շատ սկավառակի տարածք (սկզբնական պատկերը + նոր ֆորմատը + մի քանի մինիատյուրների չափեր)։
• Մեթոդ 2: Փոխարինել և ջնջել բնօրինակ պատկերը (ավելի արմատական)Դիսկը ընդլայնման հակված չէ, սակայն եթե փոփոխեք ակտիվները և հղումները, համատեղելիության խնդիրների լուծումը ավելի թանկ է նստում։
  Կայքը որքան ավելի բարդ է (էլեկտրոնային առևտուր, բազմաթիվ պլագիններ, տարբեր չափեր), այնքան ավելի խորհուրդ ենք տալիս սկսել ավելի կայուն մոտեցումից։

8. Արդյո՞ք EWWW Image Optimizer-ի կողմից առաջարկվող անվճար տեղային կոմպրեսիան բավարար է՞ Կարո՞ղ է այն ծանրաբեռնել սերվերը։

EWWW-ն ավելի շուտ տեղային կոմպրեսիոն գործիք է՝ այն սպառում է 1 TP և 199 T/IO։
Բեռի աճը խմբաքանակային օպտիմալացման ընթացքում սովորական է; սա չի նշանակում, որ համակարգը “վերջանում” է, այլ այն, որ մոտեցումը պետք է ճիշտ լինի՝ աշխատանքը կատարել խմբաքանակներով, ոչ պիկ ժամերին և անհրաժեշտության դեպքում ընտրել տվյալների արտահանձնումը կամ ամպային լուծումները։
Եթե դուք փնտրում եք առանց խնդիրների լուծում կամ եթե ձեր սերվերի ռեսուրսները սահմանափակ են, B տարբերակը ավելի հարմար է սերվերի համար։

9. ShortPixel-ը ամսական տրամադրում է 100 անվճար կրեդիտ, բայց ինչո՞ւ եմ զգում, որ դրանք սպառվում են ընդամենը մի քանի պատկերից հետո։

քանի որ “Credits”-ը չի վերաբերում «նկարների թվին»։”, մեծացվելու է մատնահետքերով և հաջորդ սերնդով:

• Յուրաքանչյուր մինի պատկերի համար բնօրինակ պատկեր և հեղինակային նշում
• Եթե ստեղծվում են WebP/AVIF ֆայլեր, յուրաքանչյուր համապատասխան տարբերակի համար կգանձվի հավելյալ վարկային միավոր։
  Այսինքն՝ այն, ինչ դուք կարող եք մտածել՝ “մեկ պատկեր” է, իրականում կարող է օգտագործել գրեթե “երկնիշ կրեդիտներ”։ ShortPixel

10. Ինչու՞ Imagify-ի անվճար 20MB/ամսական թույլատրելի ծավալը այդքան արագ սպառվում է։

Imagify-ը ավելի շուտ նման է “տվյալների փաթեթի”.

• Ձեր հաղորդագրության համաձայնՕրինակային ֆայլի չափըՀանել քվոտայից
• Քանի որ ավելի շատ նախադիտման պատկերակներ կան, այնքան ավելի մեծ ռեսուրսներ են սպառվում։
• Կոմպրեսիայի մակարդակի փոփոխությունն ու կրկնակի օպտիմալացումը կրկին կծախսի քվոտան։
• Մեկ API-клюչը կարելի է օգտագործել մի քանի կայքերում՝ կիսվող քվոտաներով։
  Ուստի “20MB-ը շուտով սպառվելու է” հաղորդագրությունը հաճախ առաջանում է պատկերների չափազանց մեծ լինելու, չափազանց շատ թումբնեյլների կամ կրկնվող փորձարկումների և սխալների պատճառով։

11. TinyPNG-ն առաջարկում է ամսական 500 անվճար կրեդիտ, ուրեմն ինչո՞ւ պլագինը ցույց է տալիս, որ ամսական միայն մոտ 100 պատկեր է հասանելի, և ինչո՞ւ WebP/AVIF-ը միացնելուց հետո այդ քանակը նվազում է մինչև 50 պատկեր։

Սա այն պատճառով է, որ TinyPNG կրեդիտները նույնպես մեծացվում են “Dimensions/Variants” բաժնում։

• Ստանդարտ WordPress տեղադրումը սովորաբար ամսական մոտ 100 պատկեր է սեղմում։
• Ակտիվացնել AVIF կամ WebP փոխարկումը:Յուրաքանչյուր պատկերի չափը կարժենա մեկ հավելյալ կրեդիտ։, այդ պատճառով ես հավանաբար կարող եմ ամսական միայն մոտ 50 պատկեր սեղմել և փոխարկել (կախված է մինիատյուրաների չափերի քանակից).
  Այսպիսով, 500 կրեդիտը չի հավասար 500 պատկերների։

12. Մեր կայքում քանի՞ մինի պատկերակ կա։ Ինչո՞ւ դրանք ունեն այդքան մեծ ազդեցություն։

WordPress-ում պատկեր վերբեռնելիս ստեղծվում են մի քանի չափսեր; թեմաներն ու պլագինները (հատկապես էլեկտրոնային առևտրի համար նախատեսվածները) կարող են ստեղծել նույնիսկ ավելի շատ:
Ամպային կոմպրեսիայի դեպքում կրեդիտներն կամ քվոտաները սովորաբար հաշվարկվում են ելակետային պատկերի և դրա թումբնեյլերի համատեղ ընդհանուր չափի հիման վրա, ուստի որքան շատ թումբնեյլեր կան, այնքան ավելի արագ կծախսվի անվճար թույլատրելի ծավալը։

13. Արդյո՞ք ծույլ բեռնումը միշտ արագացնում է գործընթացը։ Ինչո՞ւ որոշ մարդիկ ասում են, որ ծույլ բեռնումը իրականում դանդաղեցնում է այն։

Թուլատվական բեռնումը հարմար է “էկրանից դուրս ռեսուրսների” համար։
Եթե առաջին էկրանին գտնվող ամենակարևոր մեծ պատկերը նույնպես ուշանա, դա կարող է դանդաղեցնել սկզբնական բեռման փորձը։ Թեև WordPress 5.5-ում և ավելի նոր տարբերակներում ներդրված ծույլ բեռնումը լավ է, այն չպետք է կիրառել ամենուր։

14. Ե՞րբ ինձ անհրաժեշտ է CDN / Image CDN, եթե ես ընտրում եմ A կամ B երթուղին։

Կոմպրեսիան, ֆայլի չափը և ֆորմատը լուծում են ֆայլերը փոքրացնելու և ավելի հարմար դարձնելու խնդիրը։
CDN ապահովում է ավելի արագ և հուսալի առաքում。
Երբ պատկերները հեռավոր օրիջին սերվերից բերվելու պատճառով առաջանում է զգալի ուշացում, յուրաքանչյուր պատկերի համար հավելյալ CDN (օրինակ՝ Cloudflare Polish/Jetpack Site Accelerator) ավելացնելը, որպես կանոն, ապահովում է ավելի կայուն փորձ և բովանդակությունը դարձնում է ավելի հեշտ ընթերցվող։ WordPress CDN արագացում。

15. Երբ ավարտեմ, ի՞նչն է ամենահեշտ միջոցը ստուգելու, որ այն իսկապես աշխատում է։

Հաստատելու ամենաարագ միջոցը՝

• Նույն էջը երկրորդ անգամ թարմացնելիս բեռման գործընթացը ավելի կայուն և արագ է՞
• Կա՞ նկատելի տարբերություն պատկերի չափի մեջ շարժական և աշխատասեղանի տարբերակների միջև (srcset/sizes-ը աշխատո՞ւմ է ըստ նախատեսվածի)։
• Պատահականորեն ստուգեք մի քանի պատկեր՝ արդյոք կան WebP կամ AVIF ֆայլեր/ռեսուրսներ։
• Նայեք մի քանի պատկերների վրա՝ մեծացրեք դրանք, որպեսզի տեսնեք՝ արդյոք դրանք նկատելիորեն մշուշ են, թե տեքստը թվացյալ մշուշ է։