W3 ટોટલ કેશ મિનિફાઇ પ્લગઇન સેટિંગ્સ: એમ્બેડિંગ પ્રકાર કેવી રીતે પસંદ કરવો? મારો મુશ્કેલીનિવારણ અનુભવ અને જીવન બચાવ સલાહ

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

હું એક વેબસાઇટ ઑપ્ટિમાઇઝ કરી રહ્યો હતો અને જ્યારે મેં W3 ટોટલ કેશમાં મિનિફાઇ સેટિંગ્સ ખોલી, ત્યારે હું સંપૂર્ણપણે સ્તબ્ધ થઈ ગયો. એમ્બેડેડ પ્રકાર માટેના ડ્રોપડાઉન મેનૂમાં ચાર વિકલ્પો હતા: ડિફોલ્ટ (બ્લોક), નોન-બ્લોકિંગ માટે JS નો ઉપયોગ કરો, નોન-બ્લોકિંગ માટે "એસિંક્રોનસ" નો ઉપયોગ કરો અને નોન-બ્લોકિંગ માટે "વિલંબિત" નો ઉપયોગ કરો.

મેં એક ક્ષણ માટે વિચાર્યું, આ બધું શું છે?

મારા પર વિશ્વાસ કરો, તમે એકલા નથી. આ ચાર વિકલ્પો કદાચ એક શિખાઉ માણસને પણ મૂંઝવણમાં મૂકી દેશે, વર્ષોથી WordPress વાપરતા વ્યક્તિને તો વાત જ છોડી દો. આ લેખ મેં અનુભવેલી મુશ્કેલીઓ અને મેં શીખેલા પાઠ સીધા તમારા માટે રજૂ કરે છે. તમારે દસ્તાવેજો જોવાની જરૂર નથી; ફક્ત મારી સૂચનાઓનું પાલન કરો.

આ ચાર એમ્બેડિંગ પ્રકારો ખરેખર કયા છે?

ચાલો પહેલા વાત કરીએ કે આ ચાર વિકલ્પો કયા પ્રકારના પાત્ર છે.

ડિફોલ્ટ (બ્લોક)આને ડિફોલ્ટ બ્લોકિંગ કહેવામાં આવે છે. આ સૌથી સીધો અભિગમ છે: જ્યારે બ્રાઉઝર કોઈ સ્ક્રિપ્ટનો સામનો કરે છે ત્યારે તે અટકી જાય છે, તેને સંપૂર્ણપણે ડાઉનલોડ કરે છે અને એક્ઝિક્યુટ કરે છે, અને પછી પૃષ્ઠને રેન્ડર કરવાનું ચાલુ રાખે છે. વિશ્વસનીય લાગે છે, ખરું ને? પરંતુ તેનો ફાયદો એ છે કે તમારું પ્રારંભિક પૃષ્ઠ લોડ અવરોધિત થઈ જશે; વપરાશકર્તાઓ કંઈપણ જોઈ શકે તે પહેલાં સ્ક્રિપ્ટ ચાલુ થાય ત્યાં સુધી રાહ જોવી પડશે.

બિન-અવરોધિત કરવા માટે JS નો ઉપયોગ કરવોઆ ખૂબ જ રસપ્રદ છે. પેજ પર સીધા `<script>` ટૅગ્સ લખવાને બદલે, તે પહેલા એક નાની સ્ક્રિપ્ટ આઉટપુટ કરે છે, અને પછી પેજ ચાલુ થયા પછી JavaScript દ્વારા પેજમાં લોડ કરવાની જરૂર હોય તેવી સ્ક્રિપ્ટોને ગતિશીલ રીતે ઇન્જેક્ટ કરે છે. આ રીતે, પેજ પહેલા રેન્ડર કરી શકાય છે, અને સ્ક્રિપ્ટો ધીમે ધીમે લોડ થઈ શકે છે. સરસ લાગે છે, ખરું ને? જો કે, સમસ્યા એ છે કે આ ડાયનેમિક ઇન્જેક્શન પ્રક્રિયા સ્ક્રિપ્ટોના મૂળ એક્ઝેક્યુશન ક્રમમાં વિક્ષેપ પાડી શકે છે. જો તમારા પેજ પરની કેટલીક સ્ક્રિપ્ટો એક્ઝેક્યુશન ક્રમ પર ખૂબ આધાર રાખે છે, તો સમસ્યાઓ ઊભી થઈ શકે છે.

બિન-અવરોધિત કરવા માટે "અસિંક્રોનસ" નો ઉપયોગ કરોઆમાં `<script>` ટેગમાં `async` એટ્રિબ્યુટ ઉમેરવાનો સમાવેશ થાય છે. સ્ક્રિપ્ટ પૃષ્ઠભૂમિમાં અસુમેળ રીતે ડાઉનલોડ થશે અને ડાઉનલોડ કર્યા પછી તરત જ એક્ઝિક્યુટ થશે, પૃષ્ઠ તેની રાહ જોયા વિના. જોકે, નુકસાન એ છે કે એક્ઝિક્યુશન ક્રમ સંપૂર્ણપણે અનિયંત્રિત છે; જે પણ સ્ક્રિપ્ટ પહેલા ડાઉનલોડ કરવાનું સમાપ્ત કરે છે તે પહેલા એક્ઝિક્યુટ થાય છે, પછી ભલે તમે કોડમાં ઉલ્લેખિત ક્રમ ગમે તે હોય.

બિન-અવરોધિત કરવા માટે "વિલંબ" નો ઉપયોગ કરવો`defer` એટ્રીબ્યુટ ઉમેરવાનો અર્થ આ જ છે. સ્ક્રિપ્ટ એક્ઝિક્યુટ કરતા પહેલા આખા પેજનું વિશ્લેષણ થાય ત્યાં સુધી રાહ જોશે, અને મહત્વનું છે કે, તે તમે લખેલા મૂળ ક્રમને જાળવી રાખશે. આ એકદમ વપરાશકર્તા મૈત્રીપૂર્ણ છે, કારણ કે તે ન તો પ્રથમ સ્ક્રીનને અવરોધિત કરે છે અને ન તો ક્રમમાં વિક્ષેપ પાડે છે.

મારે કયું પસંદ કરવું જોઈએ?

સરળ શબ્દોમાં કહીએ તો, આ ચાર વિકલ્પો બહુવિધ-વિકલ્પવાળા પ્રશ્ન જેવા છે:તમને ઝડપ જોઈએ છે કે ક્રમ?

મારું સૂચન નીચે મુજબ છે:

જો તમારી વેબસાઇટ નાની છે, થોડી સ્ક્રિપ્ટો છે, અને લોડિંગ સ્પીડ માટે તમારી પાસે ખૂબ ઊંચી આવશ્યકતાઓ નથી, તો ડિફોલ્ટ (બ્લોક કરેલ) સેટિંગનો ઉપયોગ કરવો એ સૌથી સરળ વિકલ્પ છે. જોકે તે થોડું ધીમું છે, તે કોઈ સમસ્યા ઊભી કરશે નહીં.

જો તમે પહેલી સ્ક્રીનની ગતિ સુધારવા માંગતા હો અને તમારી સ્ક્રિપ્ટોમાં "A ને B પહેલા એક્ઝિક્યુટ કરવું જોઈએ" જેવી મજબૂત નિર્ભરતા ન હોય, તો પ્રાથમિકતા આપો...બિન-અવરોધિત કરવા માટે "વિલંબ" નો ઉપયોગ કરવો(મુલતવી રાખો). આ હાલમાં લગભગ સૌથી આદર્શ ઉકેલ છે, કારણ કે તે રેન્ડરિંગને અવરોધિત કરતું નથી કે ક્રમમાં વિક્ષેપ પાડતું નથી.

જો તમે ડિફર કરવાનો પ્રયાસ કરો છો અને હજુ પણ કેટલાક કાર્યોમાં સમસ્યાઓ જણાય છે, તો ધ્યાનમાં લો...બિન-અવરોધિત કરવા માટે JS નો ઉપયોગ કરવોઆ ઉકેલ વધુ આમૂલ છે, પરંતુ તેની સુસંગતતા થોડી ખરાબ છે.

બિન-અવરોધિત કરવા માટે "અસિંક્રોનસ" નો ઉપયોગ કરો(async) એ વિકલ્પ છે જેની હું ઓછામાં ઓછી ભલામણ કરું છું. એક્ઝેક્યુશન ઓર્ડર સંપૂર્ણપણે ગરબડ થયેલો હોવાથી, જ્યાં સુધી તમને ખાતરી ન હોય કે તમારી બધી સ્ક્રિપ્ટો સ્વતંત્ર રીતે ચાલી રહી છે ત્યાં સુધી તે ક્રેશ થવું સરળ છે.

બે મોટા ખાડા જેમાં હું પડ્યો

વાતો કરવી સસ્તી છે. મેં કરેલી બે ભૂલો લખી છે; તમે તેમને તમારા પોતાના અનુભવ સાથે ચકાસી શકો છો કે શું તમે તેમને ટાળી શકો છો.

પહેલો ખતરો: કસ્ટમ વર્ડપ્રેસ થીમ્સનું રીઅલ ટાઇમમાં પ્રીવ્યૂ કરી શકાતું નથી.

થોડા સમય માટે, થીમ કસ્ટમાઇઝ કરતી વખતે, સેવ પર ક્લિક કર્યા પછી, પ્રીવ્યૂ રિફ્રેશ થતો ન હતો. હું કેટલાક ફેરફારો કરીશ, પેજ રિફ્રેશ કરીશ, અને તે હજુ પણ એ જ રહેશે.

થોડી તપાસ કર્યા પછી, મને ખબર પડી કે મિનિફાઇનું કમ્પ્રેશન ફંક્શન ગુનેગાર હતું. ઉકેલ સરળ છે:

W3 ટોટલ કેશ પ્લગઇન ઍક્સેસ કરો常规设置,ઉપર આવો"સંકોચન"તે વિકલ્પને અનચેક કરો. પછી ઉપર જમણા ખૂણામાં "સેવ સેટિંગ્સ" નીચે નાના તીર પર ક્લિક કરો અને "..." પસંદ કરો.સેટિંગ્સ સાચવો અને કેશ સાફ કરોઆ પગલું ખૂબ જ મહત્વપૂર્ણ છે; જો તમે કેશ સાફ નહીં કરો, તો પણ તમને જૂનું વર્ઝન દેખાતું રહેશે.

એકવાર તમે પૂર્ણ કરી લો, પછી થીમ કસ્ટમાઇઝેશન પર પાછા જાઓ, અને લાઇવ પ્રીવ્યૂ સામાન્ય થઈ જશે.

બીજી સમસ્યા: એસ્ટ્રા થીમ સર્ચ બોક્સ ક્લિક કરવામાં આવે ત્યારે જવાબ આપતું નથી.

મને ઘણા સમય પહેલા આ સમસ્યાનો સામનો કરવો પડ્યો હતો. હું એસ્ટ્રા થીમનો ઉપયોગ કરી રહ્યો હતો, અને એક દિવસ મને અચાનક ખબર પડી કે સર્ચ બોક્સ ગમે તેટલી ક્લિક કર્યા પછી પણ જવાબ આપી રહ્યું નથી. શરૂઆતમાં, મને લાગ્યું કે તે થીમમાં જ સમસ્યા છે, પરંતુ પછી મને ખબર પડી કે તે W3TC ના Minify સેટિંગ્સને કારણે છે.

ઉકેલ નીચે મુજબ છે:

W3 ટોટલ કેશ → જનરલ સેટિંગ્સ → એડવાન્સ્ડ કમ્પ્રેશન સેટિંગ્સ → JS → મિનિફાઇ એન્જિન સેટિંગ્સ → લોકેલ સેટિંગ્સ પર જાઓ, અને એમ્બેડિંગ પ્રકારને આ બેમાંથી એકમાં બદલો:

1. પહેલાં, જાવાસ્ક્રિપ્ટનો ઉપયોગ કરીને નોન-બ્લોકિંગ પ્રાપ્ત કરવામાં આવતું હતું.
2. પછી, નોન-બ્લોકિંગ માટે JS નો ઉપયોગ કરો

તેવી જ રીતે, કેશ સાફ કરવાથી અને પેજને રિફ્રેશ કરવાથી સર્ચ બોક્સ યોગ્ય રીતે કામ કરશે.

આ બે વિકલ્પો શા માટે અન્ય વિકલ્પોને બદલે પસંદ કરવામાં આવ્યા હતા, તે અંગે મેં થોડું સંશોધન કર્યું છે. સરળ શબ્દોમાં કહીએ તો, એસ્ટ્રા થીમના ફ્રન્ટ-એન્ડ ઘટકો સ્ક્રિપ્ટ એક્ઝેક્યુશનના સમય પ્રત્યે ખૂબ સંવેદનશીલ છે, અને કેટલીક નોન-બ્લોકિંગ પદ્ધતિઓ ઇવેન્ટ બાઇન્ડિંગને નિષ્ફળ બનાવી શકે છે. "નોન-બ્લોકિંગ વિથ JS" મોડનો ઉપયોગ ખાતરી કરે છે કે સ્ક્રિપ્ટ પેજ લોડિંગ પૂર્ણ થયા પછી જ એક્ઝેક્યુટ થાય છે, જ્યારે એસિંક સાથે જોવા મળતા અવ્યવસ્થિત એક્ઝેક્યુશનને ટાળે છે.

મુલાકાત લેવાના સ્થળોની યાદી

છેલ્લે, અહીં એક ચેકલિસ્ટ છે જે તમે સીધા અનુસરી શકો છો:

પહેલું પગલું એ છે કે તમારા ધ્યેયને સ્પષ્ટ કરો. શું તમે સૌથી ઝડપી પ્રારંભિક પૃષ્ઠ લોડ ઇચ્છો છો, અથવા તમે સ્થિરતા અને ભૂલ-મુક્ત કામગીરીને પ્રાથમિકતા આપો છો? આ નક્કી કરશે કે તમારે કયા એમ્બેડિંગ પ્રકારનો ઉપયોગ કરવો જોઈએ.

બીજું પગલું એ છે કે બધું એક જ સમયે બદલવું નહીં. પ્રથમ, તેને ચકાસવા માટે ઓછું મહત્વનું પૃષ્ઠ શોધો, તેને એક કે બે દિવસ માટે અવલોકન કરો, અને જો તમને ખાતરી હોય કે કોઈ સમસ્યા નથી, તો જ તેને આખી સાઇટ પર પ્રમોટ કરો.

ત્રીજું, દરેક ફેરફાર પછી હંમેશા કેશ સાફ કરો. W3TC નું કેશિંગ મિકેનિઝમ તમને નવીનતમ ફેરફારો જોવાથી અટકાવશે, તેથી "કેશ સાફ કરો અને ફરીથી પરીક્ષણ કરો" પગલું એકદમ આવશ્યક છે.

ચોથું, તમારા બ્રાઉઝરના ડેવલપર ટૂલ્સ અથવા પેજસ્પીડ ઇનસાઇટ્સ જેવા ટૂલ્સનો ઉપયોગ કરીને લોડિંગ પહેલાં અને પછીની ગતિની તુલના કરો. ડેટાને ફક્ત તમારા આંતરડાની લાગણીને જ નહીં, પણ તેના પોતાના માટે બોલવા દો.

写在最后

સાચું કહું તો, જ્યારે મેં પહેલી વાર આ એમ્બેડેડ ટાઇપ સેટિંગ જોયું, ત્યારે હું લાંબા સમય સુધી સ્તબ્ધ રહી ગયો. ડિફોલ્ટ બ્લોકિંગ મોડ ખૂબ ધીમો લાગતો હતો, જ્યારે એસિંક્રોનસ મોડ કામગીરીના ક્રમની ગેરંટી આપતો ન હતો, અને મુલતવી રાખવાથી સુસંગતતા સમસ્યાઓ થઈ શકે છે. મને કયો વિકલ્પ પસંદ કરવો તે અંગે ખાતરી નહોતી.

પણ મને પછીથી સમજાયું કે તે એક પ્રકારનો બદલો છે. તમારી પાસે સૌથી ઝડપી અને સૌથી સ્થિર બંને ન હોઈ શકે; તમારે હંમેશા એકનું બલિદાન આપવું પડે છે. મારો અનુભવ એ છે કે પહેલા ડિફરનો ઉપયોગ કરું છું, જે હાલમાં સૌથી સુરક્ષિત નોન-બ્લોકિંગ સોલ્યુશન છે, અને પછી જો સમસ્યાઓ ઊભી થાય તો કોલબેકનો ઉપયોગ કરું છું.

જો તમને પણ આવી જ સમસ્યાઓનો સામનો કરવો પડે, અથવા મારી પદ્ધતિને અનુસર્યા પછી પણ અન્ય સમસ્યાઓ હોય, તો તેની ચર્ચા કરવા માટે નિઃસંકોચ રહો. વેબસાઇટ ડેવલપમેન્ટ એ અજમાયશ અને ભૂલ વિશે છે; કોઈ પણ તેનો અપવાદ નથી.

મારો લેખ વાંચવા બદલ આભાર. ફરી મળીશું.