கட்டுரை அடைவு
W3 Total Cache Minify-க்கு சரியான உட்பொதிப்பு வகையைத் தேர்ந்தெடுப்பதில் சிரமப்படுகிறீர்களா? இந்தக் கட்டுரை ஒரு வலைத்தள நிர்வாகியின் நிஜ உலக அனுபவத்தைப் பகிர்வதோடு, வலைத்தளப் பாணி முரண்பாடுகள் மற்றும் ஏற்றுதல் செயலிழப்புகளைத் தவிர்த்து, சரியான Minify உட்பொதிப்பு வகையைத் துல்லியமாகத் தேர்ந்தெடுப்பதற்கான படிப்படியான வழிகாட்டியையும் வழங்குகிறது. மேலும், ஆரம்பநிலையாளர்கள் கூட எளிதாகப் பயன்படுத்தக்கூடிய, பிழையற்ற ஒரு அமைவுத் தீர்வையும் இது கொண்டுள்ளது.வேர்ட்பிரஸ் மோதாமல் வேகமெடுங்கள்!
நான் ஒரு வலைத்தளத்தை மேம்படுத்திக் கொண்டிருந்தபோது, W3 Total Cache-இல் உள்ள Minify அமைப்புகளைத் திறந்ததும், முற்றிலும் திகைத்துப்போனேன். உட்பொதிந்த வகைக்கான கீழ்விரிப் பட்டியலில் நான்கு தேர்வுகள் இருந்தன: இயல்புநிலை (தடுப்பு), தடுப்பற்ற முறைக்கு JS-ஐப் பயன்படுத்து, தடுப்பற்ற முறைக்கு "ஒத்திசைவற்ற" முறையைப் பயன்படுத்து, மற்றும் தடுப்பற்ற முறைக்கு "தாமதமான" முறையைப் பயன்படுத்து.
நான் ஒரு கணம் யோசித்தேன், இதெல்லாம் என்ன?
என்னை நம்புங்கள், நீங்கள் தனியாக இல்லை. பல ஆண்டுகளாக வேர்ட்பிரஸ் பயன்படுத்தி வருபவரை விடுங்கள், இந்த நான்கு தெரிவுகளும் ஒரு புதியவரையே குழப்பத்தில் ஆழ்த்தக்கூடும். இந்தக் கட்டுரை, நான் சந்தித்த இடர்ப்பாடுகளையும் கற்றுக்கொண்ட பாடங்களையும் நேரடியாக உங்களிடம் முன்வைக்கிறது. நீங்கள் ஆவணங்களைப் பார்க்கத் தேவையில்லை; என் அறிவுறுத்தல்களைப் பின்பற்றினால் மட்டும் போதும்.
இந்த நான்கு உட்பொதிவு வகைகள் என்றால் என்ன?
முதலில் இந்த நான்கு தெரிவுகளும் எத்தகைய குணாதிசயங்களைக் கொண்டவை என்று பார்ப்போம்.
இயல்புநிலை (தொகுதி)இது இயல்புநிலைத் தடுப்பு (Default blocking) என்று அழைக்கப்படுகிறது. இது மிகவும் நேரடியான அணுகுமுறை: உலாவி ஒரு ஸ்கிரிப்டை எதிர்கொள்ளும்போது நின்று, அதை முழுமையாகப் பதிவிறக்கம் செய்து செயல்படுத்திவிட்டு, பின்னர் பக்கத்தை ரெண்டரிங் செய்யத் தொடங்கும். நம்பகமானதாகத் தெரிகிறது, இல்லையா? ஆனால் இதன் குறைபாடு என்னவென்றால், உங்கள் ஆரம்பப் பக்க ஏற்றுதல் தடுக்கப்படும்; பயனர்கள் எதையும் பார்ப்பதற்கு முன்பு, அந்த ஸ்கிரிப்ட் இயங்கி முடிக்கும் வரை காத்திருக்க வேண்டியிருக்கும்.
தடைசெய்யாத தன்மைக்கு JS-ஐப் பயன்படுத்துதல்இது மிகவும் சுவாரஸ்யமானது. பக்கத்தில் நேரடியாக `<script>` குறிச்சொற்களை எழுதுவதற்குப் பதிலாக, இது முதலில் ஒரு சிறிய ஸ்கிரிப்டை வெளியிடுகிறது, பின்னர் பக்கம் இயங்கத் தொடங்கிய பிறகு, ஏற்றப்பட வேண்டிய ஸ்கிரிப்டுகளை ஜாவாஸ்கிரிப்ட் மூலம் பக்கத்தில் டைனமிக்காகச் செருகுகிறது. இந்த வழியில், பக்கத்தை முதலில் ரெண்டர் செய்து, ஸ்கிரிப்டுகளைப் படிப்படியாக ஏற்றலாம். கேட்பதற்கு அருமையாக இருக்கிறது, இல்லையா? இருப்பினும், இதில் உள்ள சிக்கல் என்னவென்றால், இந்த டைனமிக் செருகல் செயல்முறை, ஸ்கிரிப்டுகளின் அசல் இயக்க வரிசையைச் சீர்குலைக்கக்கூடும். உங்கள் பக்கத்தில் உள்ள சில ஸ்கிரிப்டுகள் இயக்க வரிசையை மிகவும் சார்ந்திருந்தால், சிக்கல்கள் ஏற்படலாம்.
தடைசெய்யாதவற்றுக்கு "asynchronous" என்பதைப் பயன்படுத்தவும்.இதற்கு, `<script>` குறிச்சொல்லில் `async` பண்புக்கூறைச் சேர்க்க வேண்டும். ஸ்கிரிப்ட் பின்னணியில் ஒத்திசைவற்ற முறையில் பதிவிறக்கப்பட்டு, பக்கம் அதற்காகக் காத்திருக்காமல், பதிவிறக்கம் முடிந்த உடனேயே செயல்படுத்தப்படும். இருப்பினும், இதன் குறைபாடு என்னவென்றால், செயல்படுத்தும் வரிசையை நம்மால் முழுமையாகக் கட்டுப்படுத்த முடியாது; குறியீட்டில் நீங்கள் குறிப்பிட்ட வரிசையைப் பொருட்படுத்தாமல், எந்த ஸ்கிரிப்ட் முதலில் பதிவிறக்கத்தை முடிக்கிறதோ, அதுவே முதலில் செயல்படுத்தப்படும்.
தடைசெய்யாதவற்றுக்கு "தாமதம்" என்பதைப் பயன்படுத்துதல்`defer` பண்புக்கூறைச் சேர்ப்பதன் அர்த்தம் இதுதான். முழுப் பக்கமும் பகுப்பாய்வு செய்யப்படும் வரை ஸ்கிரிப்ட் காத்திருக்கும், மேலும் முக்கியமாக, நீங்கள் அதை எழுதிய அசல் வரிசையை அது பராமரிக்கும். இது மிகவும் பயனர்-நட்புடையது, ஏனெனில் இது முதல் திரையைத் தடுக்காது அல்லது வரிசையைச் சீர்குலைக்காது.
நான் எதைத் தேர்ந்தெடுக்க வேண்டும்?
எளிமையாகச் சொல்வதானால், இந்த நான்கு தெரிவுகளும் ஒரு பல்தேர்வு வினாவைப் போன்றவை:உங்களுக்கு வேகம் வேண்டுமா அல்லது ஒழுங்கு வேண்டுமா?
எனது பரிந்துரை பின்வருமாறு:
உங்கள் இணையதளம் சிறியதாகவும், குறைவான ஸ்கிரிப்டுகளைக் கொண்டதாகவும், மேலும் ஏற்றுதல் வேகத்தில் உங்களுக்கு மிக உயர்ந்த எதிர்பார்ப்புகள் இல்லாமலும் இருந்தால், இயல்புநிலை (தடுக்கப்பட்ட) அமைப்பைப் பயன்படுத்துவதே மிகவும் எளிதான தேர்வாகும். இது சற்றே மெதுவாக இருந்தாலும், எந்தப் பிரச்சனைகளையும் ஏற்படுத்தாது.
முதல் திரையின் வேகத்தை நீங்கள் மேம்படுத்த விரும்பினால், மேலும் உங்கள் ஸ்கிரிப்டுகளுக்கு 'B-க்கு முன் A இயங்க வேண்டும்' என்பது போன்ற வலுவான சார்புநிலைகள் இல்லை என்றால், முன்னுரிமை அளியுங்கள்...தடைசெய்யாதவற்றுக்கு "தாமதம்" என்பதைப் பயன்படுத்துதல்(தள்ளிவைத்தல்). இது தற்போதைக்கு ஏறக்குறைய மிகவும் உகந்த தீர்வாகும், ஏனெனில் இது ரெண்டரிங்கைத் தடுப்பதும் இல்லை, வரிசையைச் சீர்குலைப்பதும் இல்லை.
நீங்கள் ஒத்திவைத்துப் பார்த்த பிறகும் சில செயல்பாடுகளில் சிக்கல்கள் இருப்பதைக் கண்டறிந்தால், பிறகு இதைக் கருத்தில் கொள்ளுங்கள்...தடைசெய்யாத தன்மைக்கு JS-ஐப் பயன்படுத்துதல்இந்தத் தீர்வு மிகவும் தீவிரமானது, ஆனால் இதன் இணக்கத்தன்மை சற்றே மோசமாக உள்ளது.
தடைசெய்யாதவற்றுக்கு "asynchronous" என்பதைப் பயன்படுத்தவும்.(async) என்பது நான் மிகக் குறைவாகப் பரிந்துரைக்கும் ஒரு வழிமுறை. ஏனெனில், செயலாக்க வரிசை முற்றிலும் குழப்பமடைந்துள்ளதால், உங்கள் ஸ்கிரிப்டுகள் அனைத்தும் தனித்தனியாக இயங்குகின்றன என்பதில் உங்களுக்கு முழு நம்பிக்கை இல்லாவிட்டால், அது எளிதில் செயலிழந்துவிடும்.
நான் சிக்கிக்கொண்ட இரண்டு பெரிய பள்ளங்கள்
பேச்சுக்கு மதிப்பில்லை. நான் செய்த இரண்டு தவறுகளை எழுதி வைத்திருக்கிறேன்; அவற்றை உங்கள் சொந்த அனுபவத்துடன் ஒப்பிட்டுப் பார்த்து, உங்களால் தவிர்க்க முடியுமா என்று தெரிந்துகொள்ளலாம்.
முதல் சிக்கல்: தனிப்பயன் வேர்ட்பிரஸ் தீம்களை நிகழ் நேரத்தில் முன்னோட்டமிட முடியாது.
சிறிது காலமாக, ஒரு தீம்மைத் தனிப்பயனாக்கும்போது, சேமி என்பதைக் கிளிக் செய்த பிறகு, முன்னோட்டம் புதுப்பிக்கப்படவில்லை. நான் சில மாற்றங்களைச் செய்து, பக்கத்தைப் புதுப்பித்தாலும், அது அப்படியேதான் இருந்தது.
சிறிது விசாரணைக்குப் பிறகு, மினிஃபையின் சுருக்கச் செயல்பாடுதான் இதற்குக் காரணம் என்பதைக் கண்டுபிடித்தேன். தீர்வு எளிமையானது:
W3 மொத்த கேச் செருகுநிரலை அணுகவும்常规设置வந்து சேர்"அழுத்தம்"அந்த விருப்பத்தேர்வைத் தேர்வுநீக்கவும். பிறகு, மேல் வலது மூலையில் உள்ள "அமைப்புகளைச் சேமி" என்பதற்கு கீழே உள்ள சிறிய அம்புக்குறியைக் கிளிக் செய்து "..." என்பதைத் தேர்ந்தெடுக்கவும்.அமைப்புகளைச் சேமித்து, கேச்-ஐ அழிக்கவும்.இந்தப் படிநிலை மிகவும் முக்கியமானது; நீங்கள் கேச்-ஐ அழிக்காவிட்டால், பழைய பதிப்பையே தொடர்ந்து பார்க்க நேரிடும்.
நீங்கள் முடித்த பிறகு, தீம் தனிப்பயனாக்கத்திற்குத் திரும்பிச் செல்லுங்கள், நேரலை முன்னோட்டம் மீண்டும் இயல்பு நிலைக்குத் திரும்பிவிடும்.
இரண்டாவது சிக்கல்: அஸ்ட்ரா தீம் தேடல் பெட்டியைக் கிளிக் செய்யும்போது அது செயல்படுவதில்லை.
நான் இந்தச் சிக்கலை வெகு காலத்திற்கு முன்பே எதிர்கொண்டேன். நான் ஆஸ்ட்ரா தீம்-ஐப் பயன்படுத்திக் கொண்டிருந்தேன், ஒரு நாள் திடீரென்று, நான் எப்படி கிளிக் செய்தாலும் தேடல் பெட்டி செயல்படவில்லை. முதலில், இது தீம்-இன் சிக்கல் என்று நினைத்தேன், ஆனால் பின்னர் W3TC-இன் மினிஃபை அமைப்புகளால் இது ஏற்பட்டது என்பதைக் கண்டுபிடித்தேன்.
தீர்வு பின்வருமாறு:
W3 Total Cache → General Settings → Advanced Compression Settings → JS → Minify Engine Settings → Locale Settings என்பதற்குச் சென்று, உட்பொதிப்பு வகையை (embedding type) இந்த இரண்டில் ஒன்றாக மாற்றவும்:
- முன்னதாக, ஜாவாஸ்கிரிப்டைப் பயன்படுத்தி தடையற்ற செயல்பாடு அடையப்பட்டது.
- அதன்பிறகு, தடையற்ற செயல்பாட்டிற்கு ஜாவாஸ்கிரிப்டைப் பயன்படுத்தவும்.
அதேபோல், கேச்-ஐ அழித்து பக்கத்தைப் புதுப்பித்தால், தேடல் பெட்டி சரியாகச் செயல்படும்.
மற்ற விருப்பங்களுக்குப் பதிலாக இந்த இரண்டு விருப்பங்கள் ஏன் தேர்ந்தெடுக்கப்பட்டன என்பது குறித்து, நான் சில ஆய்வுகளைச் செய்துள்ளேன். எளிமையாகச் சொன்னால், ஆஸ்ட்ரா தீமின் ஃப்ரண்ட்-எண்ட் கூறுகள் ஸ்கிரிப்ட் செயல்படுத்தப்படும் நேரத்திற்கு மிகவும் உணர்திறன் கொண்டவை, மேலும் சில நான்-பிளாக்கிங் முறைகள் நிகழ்வுப் பிணைப்பு தோல்வியடையக் காரணமாகலாம். "நான்-பிளாக்கிங் வித் ஜேஎஸ்" (non-blocking with JS) பயன்முறையைப் பயன்படுத்துவது, பக்கம் முழுமையாக ஏற்றப்பட்ட பின்னரே ஸ்கிரிப்ட் செயல்படுத்தப்படுவதை உறுதி செய்கிறது, அதே நேரத்தில் அசிங்க் (async) முறையில் காணப்படும் ஒழுங்கற்ற செயல்பாட்டையும் தவிர்க்கிறது.
பார்க்க வேண்டிய இடங்களின் பட்டியல்
இறுதியாக, நீங்கள் நேரடியாகப் பின்பற்றக்கூடிய சரிபார்ப்புப் பட்டியல் இதோ:
உங்கள் இலக்கைத் தெளிவுபடுத்துவதே முதல் படியாகும். நீங்கள் மிக வேகமான ஆரம்பப் பக்க ஏற்றுதலை விரும்புகிறீர்களா, அல்லது நிலைத்தன்மைக்கும் பிழையற்ற செயல்பாட்டிற்கும் முன்னுரிமை அளிக்கிறீர்களா? இதுவே நீங்கள் எந்த உட்பொதிப்பு வகையைப் பயன்படுத்த வேண்டும் என்பதைத் தீர்மானிக்கும்.
இரண்டாவது படி என்னவென்றால், எல்லாவற்றையும் ஒரே நேரத்தில் மாற்றிவிடக் கூடாது. முதலில், முக்கியத்துவம் குறைந்த ஒரு பக்கத்தைக் கண்டறிந்து அதைச் சோதித்துப் பாருங்கள், ஓரிரு நாட்களுக்கு அதைக் கவனியுங்கள், பின்னர் எந்தப் பிரச்சனைகளும் இல்லை என்று நீங்கள் உறுதியாக அறிந்தால் மட்டுமே அதை முழு வலைத்தளத்திற்கும் கொண்டு வாருங்கள்.
மூன்றாவதாக, ஒவ்வொரு மாற்றத்திற்கும் பிறகு கேச்-ஐ எப்போதும் அழிக்கவும். W3TC-யின் கேச்சிங் பொறிமுறையானது, சமீபத்திய மாற்றங்களை நீங்கள் பார்ப்பதைத் தடுக்கும், எனவே "கேச்-ஐ அழித்து மீண்டும் சோதிக்கவும்" என்ற படிநிலை முற்றிலும் அவசியமானது.
நான்காவதாக, உங்கள் உலாவியின் டெவலப்பர் கருவிகள் அல்லது PageSpeed Insights போன்ற கருவிகளைப் பயன்படுத்தி, முன்பும் பின்பும் உள்ள ஏற்றுதல் வேகத்தை ஒப்பிட்டுப் பாருங்கள். உங்கள் உள்ளுணர்வை மட்டும் நம்பாமல், தரவுகளே பேசட்டும்.
இறுதியில் எழுதுங்கள்
உண்மையைச் சொல்லப்போனால், நான் முதன்முதலில் இந்த எம்பெடட் டைப் செட்டிங்கைப் பார்த்தபோது, நீண்ட நேரம் திகைத்துப்போனேன். இயல்புநிலை பிளாக்கிங் மோடு மிகவும் மெதுவாக இருப்பதாகத் தோன்றியது, அதே சமயம் அசிங்க்ரோனஸ் மோடு செயல்பாடுகளின் வரிசைக்கு உத்தரவாதம் அளிக்கவில்லை, மேலும் டிஃபர்லிங் செய்வதால் இணக்கச் சிக்கல்கள் ஏற்படக்கூடும். எந்த விருப்பத்தைத் தேர்ந்தெடுப்பது என்பதில் எனக்குத் தயக்கம் இருந்தது.
ஆனால், இது ஒரு சமரசம் என்பதை நான் பின்னர் உணர்ந்தேன். மிக வேகமானதையும், மிக நிலையானதையும் ஒரே நேரத்தில் பெற முடியாது; நீங்கள் எப்போதும் இரண்டில் ஒன்றை தியாகம் செய்ய வேண்டியிருக்கும். எனது அனுபவத்தில், முதலில் 'defer'-ஐப் பயன்படுத்துவதுதான் வழக்கம். தற்போதுள்ளவற்றில் இதுவே மிகவும் பாதுகாப்பான, தடைசெய்யாத (non-blocking) தீர்வாகும். பின்னர், சிக்கல்கள் ஏற்பட்டால் 'callback'-ஐப் பயன்படுத்த வேண்டும்.
நீங்களும் இதே போன்ற சிக்கல்களை எதிர்கொண்டால், அல்லது எனது வழிமுறையைப் பின்பற்றிய பிறகும் உங்களுக்கு வேறு பிரச்சனைகள் இருந்தால், தயங்காமல் அதைப் பற்றி விவாதிக்கவும். இணையதள உருவாக்கம் என்பது முழுக்க முழுக்க முயன்று பார்த்துத் தவறு செய்வதைப் பற்றியது; யாரும் இதற்கு விதிவிலக்கல்ல.
என் கட்டுரையைப் படித்ததற்கு நன்றி. அடுத்த முறை சந்திப்போம்.
ஹோப் சென் வெலியாங் வலைப்பதிவு ( https://www.chenweiliang.com/ நான் பகிர்ந்த "W3 Total Cache Minify Plugin Settings: How to Choose the Embedding Type? My Pitfalls and Lifesaving Tips" என்ற கட்டுரை உங்களுக்குப் பயனுள்ளதாக இருக்கலாம்.
இந்தக் கட்டுரையின் இணைப்பைப் பகிர வரவேற்கிறோம்:https://www.chenweiliang.com/cwl-34003.html