வெளிப்புற CSS மற்றும் Javascript ஆகியவற்றைச் சேர்ப்பதன் மூலம், தேவையற்ற HTTP கோரிக்கைகளை குறைந்தபட்சமாகக் குறைக்க விரும்புகிறோம்.

இந்த நோக்கத்திற்காக, .js மற்றும் .css கோப்புகள் நம்பகமான தற்காலிக சேமிப்பை உறுதி செய்யும் தலைப்புகளுடன் வழங்கப்படுகின்றன.

ஆனால் மேம்பாட்டின் போது இந்தக் கோப்புகளில் ஒன்று மாறும்போது நீங்கள் என்ன செய்வீர்கள்? எல்லா பயனர்களும் அதை தற்காலிக சேமிப்பில் வைத்திருக்கிறார்கள் பழைய பதிப்பு- கேச் காலாவதியாகும் வரை, சேவையகம் மற்றும் கிளையன்ட் பாகங்களின் உடைந்த ஒருங்கிணைப்பு குறித்து நிறைய புகார்கள் இருக்கும்.

முறையான கேச்சிங் மற்றும் பதிப்பு இந்த சிக்கலை முற்றிலும் நீக்குகிறது மற்றும் ஸ்டைல்/ஸ்கிரிப்ட் பதிப்புகளின் நம்பகமான, வெளிப்படையான ஒத்திசைவை வழங்குகிறது.

எளிய ETag கேச்சிங்

நிலையான ஆதாரங்களைத் தற்காலிகமாக சேமிப்பதற்கான எளிய வழி ETag ஐப் பயன்படுத்துவதாகும்.

பொருத்தமான சர்வர் அமைப்பை இயக்கினால் போதும் (அபாச்சிக்கு இது இயல்பாகவே இயக்கப்படும்) - மேலும் தலைப்புகளில் உள்ள ஒவ்வொரு கோப்பிற்கும் ஒரு ETag கொடுக்கப்படும் - புதுப்பிப்பு நேரம், கோப்பு அளவு மற்றும் (inode-அடிப்படையில்) சார்ந்த ஹாஷ் கோப்பு முறைமைகள்) ஐனோட்.

உலாவி அத்தகைய கோப்பைத் தேக்ககப்படுத்துகிறது மேலும், அடுத்தடுத்த கோரிக்கைகளில், தற்காலிகச் சேமிப்பு ஆவணத்தின் ETag உடன் If-None-Match என்ற தலைப்பைக் குறிப்பிடுகிறது. அத்தகைய தலைப்பைப் பெற்ற பிறகு, சேவையகம் குறியீடு 304 உடன் பதிலளிக்க முடியும் - பின்னர் ஆவணம் தற்காலிக சேமிப்பிலிருந்து எடுக்கப்படும்.

இது போல் தெரிகிறது:

சேவையகத்திற்கான முதல் கோரிக்கை (கேச் சுத்தமானது) GET /misc/pack.js HTTP/1.1 ஹோஸ்ட்: இணையதளம்

பொதுவாக, உலாவி பொதுவாக பயனர் முகவர், ஏற்றுக்கொள் போன்ற தலைப்புகளின் தொகுப்பைச் சேர்க்கிறது. அவை சுருக்கத்திற்காக வெட்டப்படுகின்றன.

சேவையக பதில் 200 மற்றும் ETag கொண்ட ஆவணத்துடன் சேவையகம் பதிலளிக்கிறது: HTTP/1.x 200 சரி உள்ளடக்கம்-குறியீடு: gzip உள்ளடக்க வகை: உரை/ஜாவாஸ்கிரிப்ட்; charset=utf-8 Etag: "3272221997" ஏற்றுக்கொள்ளும்-வரம்புகள்: பைட்டுகள் உள்ளடக்கம்-நீளம்: 23321 தேதி: வெள்ளி, 02 மே 2008 17:22:46 GMT சேவையகம்: lighttpd அடுத்த உலாவி கோரிக்கை அடுத்த கோரிக்கையில், உலாவி If-None ஐ சேர்க்கிறது -மேட்ச்: (கேச் செய்யப்பட்ட ETag): GET /misc/pack.js HTTP/1.1 புரவலன்: தளம் என்றால்-இல்லை-மேட்ச்: "453700005" சர்வர் பதில் சர்வர் தெரிகிறது - ஆம், ஆவணம் மாறவில்லை. இதன் பொருள் நீங்கள் 304 குறியீட்டை வழங்கலாம் மற்றும் ஆவணத்தை மீண்டும் அனுப்ப முடியாது. HTTP/1.x 304 மாற்றப்படவில்லை உள்ளடக்க-குறியீடு: gzip Etag: "453700005" உள்ளடக்க-வகை: உரை/ஜாவாஸ்கிரிப்ட்; charset=utf-8 ஏற்றுக்கொள்ளும்-வரம்புகள்: பைட்டுகள் தேதி: செவ்வாய், 15 ஏப்ரல் 2008 10:17:11 GMT

மாற்று விருப்பம்- ஆவணம் மாறியிருந்தால், சேவையகம் புதிய ETag உடன் 200ஐ அனுப்புகிறது.

கடைசியாக மாற்றியமைக்கப்பட்ட + இஃப்-மாற்றியமைக்கப்பட்ட-இருந்து கலவையானது இதே வழியில் செயல்படுகிறது:

கடைசியாக மாற்றியமைக்கப்பட்ட தலைப்பில் (ETagக்கு பதிலாக) கடைசியாக மாற்றப்பட்ட தேதியை சர்வர் அனுப்புகிறது.

உலாவி ஆவணத்தைத் தற்காலிகமாகச் சேமிக்கிறது, அடுத்த முறை அதே ஆவணத்திற்கான கோரிக்கையை முன்வைக்கும் போது, ​​அது தற்காலிகச் சேமிப்பு பதிப்பின் தேதியை If-Modified-Since என்ற தலைப்பில் அனுப்புகிறது (If-None-Match என்பதற்குப் பதிலாக)

சர்வர் தேதிகளைச் சரிபார்த்து, ஆவணம் மாறவில்லை என்றால், உள்ளடக்கம் இல்லாமல் 304 குறியீட்டை மட்டுமே அனுப்புகிறது.

இந்த முறைகள் நம்பகத்தன்மையுடனும் சிறப்பாகவும் செயல்படுகின்றன, ஆனால் ஒவ்வொரு ஸ்கிரிப்ட் அல்லது பாணிக்கும் உலாவி இன்னும் கோரிக்கை வைக்க வேண்டும்.

ஸ்மார்ட் கேச்சிங். பதிப்பு

பதிப்பிற்கான பொதுவான அணுகுமுறை - சுருக்கமாக:

பதிப்பு (அல்லது மாற்றியமைக்கும் தேதி) அனைத்து ஸ்கிரிப்ட்களிலும் சேர்க்கப்பட்டது. எடுத்துக்காட்டாக, http://site/my.js ஆனது http://site/my.v1.2.js ஆக மாறும்

அனைத்து ஸ்கிரிப்ட்களும் உலாவியால் தேக்ககப்படுத்தப்படுகின்றன

ஸ்கிரிப்டைப் புதுப்பிக்கும்போது, ​​பதிப்பு புதியதாக மாறுகிறது: http://site/my.v2.0.js

முகவரி மாறிவிட்டது, எனவே உலாவி கோப்பினை மீண்டும் கோரும் மற்றும் தேக்ககப்படுத்தும்

பழைய பதிப்பு 1.2 படிப்படியாக தற்காலிக சேமிப்பில் இருந்து வெளியேறும்

கடினமான கேச்சிங்

கடினமான கேச்சிங்- ஒரு வகையான ஸ்லெட்ஜ்ஹாம்மர், இது தற்காலிக சேமிப்பு ஆவணங்களுக்கான சேவையகத்திற்கான கோரிக்கைகளை முழுவதுமாக ஆணி அடிக்கிறது.

இதைச் செய்ய, காலாவதி மற்றும் கேச்-கட்டுப்பாடு: அதிகபட்ச வயது தலைப்புகளைச் சேர்க்கவும்.

எடுத்துக்காட்டாக, PHP இல் 365 நாட்களுக்கு தேக்ககப்படுத்த:

தலைப்பு("காலாவதியானது: ".gmdate("D, d M Y H:i:s", time()+86400*365)." GMT"); தலைப்பு("கேச்-கண்ட்ரோல்: அதிகபட்ச வயது="+86400*365);

அல்லது அப்பாச்சியில் mod_header ஐப் பயன்படுத்தி நிரந்தரமாக உள்ளடக்கத்தை தேக்ககப்படுத்தலாம்:

அத்தகைய தலைப்புகளைப் பெற்ற பிறகு, உலாவி நீண்ட நேரம் ஆவணத்தை தேக்ககப்படுத்துகிறது. ஆவணத்திற்கான அனைத்து அணுகலும் சேவையகத்தைத் தொடர்பு கொள்ளாமல் உலாவி தற்காலிக சேமிப்பிலிருந்து நேரடியாக வழங்கப்படும்.

பெரும்பாலான உலாவிகள் (Opera, இன்டர்நெட் எக்ஸ்புளோரர் 6+, சஃபாரி) முகவரியில் கேள்விக்குறி இருந்தால் ஆவணங்களைத் தேக்ககப்படுத்த வேண்டாம், ஏனெனில் அவை மாறும் என்று கருதப்படுகின்றன.

அதனால்தான் கோப்பு பெயரில் பதிப்பைச் சேர்க்கிறோம். நிச்சயமாக, அத்தகைய முகவரிகளுடன் நீங்கள் mod_rewrite போன்ற தீர்வைப் பயன்படுத்த வேண்டும், இதை நாங்கள் பின்னர் கட்டுரையில் பார்ப்போம்.

பி.எஸ் ஆனால் பயர்பாக்ஸ் கேள்விக்குறிகளுடன் முகவரிகளை தேக்ககப்படுத்துகிறது...

தானியங்கி பெயர் தீர்மானம்

கோப்புகளை மறுபெயரிடாமல் தானாகவே மற்றும் வெளிப்படையாக பதிப்புகளை எவ்வாறு மாற்றுவது என்பதைப் பார்ப்போம்.

பதிப்பு -> கோப்புடன் பெயர்

எளிமையான விஷயம் என்னவென்றால், பதிப்பின் பெயரை அசல் கோப்பு பெயராக மாற்றுவது.

அப்பாச்சி அளவில் இதை mod_rewrite மூலம் செய்யலாம்:

RewriteEngine on RewriteRule ^/(.*\.)v+\.(css|js|gif|png|jpg)$ /$1$2 [L]

இந்த விதி அனைத்து css/js/gif/png/jpg கோப்புகளையும் செயலாக்குகிறது, பெயரில் இருந்து பதிப்பை நீக்குகிறது.

உதாரணத்திற்கு:

/images/logo.v2.gif -> /images/logo.gif
/css/style.v1.27.css -> /css/style.css
/javascript/script.v6.js -> /javascript/script.js

ஆனால் பதிப்பை வெட்டுவதற்கு கூடுதலாக, நீங்கள் கோப்புகளுக்கு கடினமான கேச்சிங் தலைப்புகளையும் சேர்க்க வேண்டும். mod_header வழிமுறைகள் இதற்குப் பயன்படுத்தப்படுகின்றன:

தலைப்புச் சேர் "காலாவதியாகும்" "திங்கள், 28 ஜூலை 2014 23:30:00 GMT" தலைப்புச் சேர் "Cache-Control" "max-age=315360000"

மேலும் இது பின்வரும் அப்பாச்சி கட்டமைப்பை செயல்படுத்துகிறது:

# இல் உள்ள RewriteEngine பதிப்பை நீக்குகிறது, அதே நேரத்தில் கோப்பு பதிப்பு செய்யப்பட்ட மாறியை அமைக்கிறது RewriteRule ^/(.*\.)v+\.(css|js|gif|png|jpg)$ /$1$2 # கடினமான கேச் பதிப்பு செய்யப்பட்ட கோப்புகளின் தலைப்புச் சேர் "காலாவதியாகும்" "திங்கள், 28 ஜூலை 2014 23:30:00 GMT" env=VERSIONED_FILE தலைப்பு "Cache-Control" "max-age=315360000" env=VERSIONED_FILE

mod_rewrite தொகுதி செயல்படும் விதம் காரணமாக, RewriteRule முக்கியமாக வைக்கப்பட வேண்டும் கட்டமைப்பு கோப்பு httpd.conf அல்லது சேர்க்கப்பட்ட கோப்புகள், ஆனால் .htaccess இல் இல்லை, இல்லையெனில் VERSIONED_FILE மாறி அமைக்கப்படுவதற்கு முன், தலைப்பு கட்டளைகள் முதலில் இயக்கப்படும்.

.htaccess இல் கூட தலைப்பு வழிகாட்டுதல்கள் எங்கும் இருக்கலாம் - அது ஒரு பொருட்டல்ல.

HTML பக்கத்தில் கோப்பு பெயரில் தானாக பதிப்பு சேர்க்கிறது

ஸ்கிரிப்ட்டின் பெயரில் பதிப்பை எவ்வாறு வைப்பது என்பது உங்கள் டெம்ப்ளேட் அமைப்பு மற்றும் பொதுவாக, நீங்கள் ஸ்கிரிப்ட்களைச் சேர்க்கும் விதம் (பாணிகள் போன்றவை) சார்ந்துள்ளது.

எடுத்துக்காட்டாக, மாற்றியமைக்கும் தேதியை பதிப்பாகவும், ஸ்மார்ட்டி டெம்ப்ளேட் எஞ்சினாகவும் பயன்படுத்தும் போது, ​​இணைப்புகளை இப்படி அமைக்கலாம்:

பதிப்பு செயல்பாடு பதிப்பைச் சேர்க்கிறது:

செயல்பாடு smarty_version($args)( $stat = stat($GLOBALS["config"]["site_root"].$args["src"]); $version = $stat["mtime"]; echo preg_replace("! \.(+?)$!", ".v$version.\$1", $args["src"]); )

பக்கத்தில் உள்ள முடிவு:

உகப்பாக்கம்

தேவையற்ற புள்ளிவிவர அழைப்புகளைத் தவிர்க்க, தற்போதைய பதிப்புகளின் பட்டியலுடன் தனி மாறியில் ஒரு வரிசையைச் சேமிக்கலாம்

$versions["css"] = வரிசை("group.css" => "1.1", "other.css" => "3.0", )

இந்த வழக்கில், வரிசையிலிருந்து தற்போதைய பதிப்பு HTML க்கு மாற்றாக உள்ளது.

நீங்கள் இரண்டு அணுகுமுறைகளையும் கடக்கலாம், மேலும் மேம்பாட்டின் போது மாற்றியமைக்கப்பட்ட தேதியின்படி ஒரு பதிப்பை உருவாக்கலாம் - பொருத்தத்திற்காக, மற்றும் உற்பத்தியில் - ஒரு வரிசையில் இருந்து ஒரு பதிப்பு, செயல்திறனுக்காக.

பொருந்தக்கூடிய தன்மை

ஜாவாஸ்கிரிப்ட், சிஎஸ்எஸ், படங்கள், ஃப்ளாஷ் மூவிகள் போன்ற எல்லா இடங்களிலும் இந்த கேச்சிங் முறை செயல்படுகிறது.

ஆவணம் மாறும்போதெல்லாம் இது பயனுள்ளதாக இருக்கும், ஆனால் உலாவி எப்போதும் தற்போதைய, புதுப்பித்த பதிப்பைக் கொண்டிருக்க வேண்டும்.

தரவுத்தளங்கள், வலை சேவையகங்கள் மற்றும் கிளையண்டுடன் பணிபுரியும் மட்டத்தில் எந்தவொரு வலை பயன்பாட்டின் செயல்பாட்டிலும் கேச் முக்கிய பங்கு வகிக்கிறது.

இந்த கட்டுரையில் கிளையன்ட் கேச்சிங்கைப் புரிந்துகொள்ள முயற்சிப்போம். குறிப்பாக, உலாவிகள் மற்றும் இணைய சேவையகங்களால் HTTP தலைப்புகள் என்ன பயன்படுத்தப்படுகின்றன மற்றும் அவை எதைக் குறிக்கின்றன என்பதைப் பார்ப்போம்.

ஆனால் முதலில், கிளையன்ட் பக்க கேச்சிங் ஏன் தேவைப்படுகிறது என்பதைக் கண்டுபிடிப்போம்? .

இணையப் பக்கங்கள் பலவற்றைக் கொண்டிருக்கின்றன பல்வேறு கூறுகள்: படங்கள், css மற்றும் js கோப்புகள் போன்றவை. இந்த கூறுகளில் சில தளத்தின் பல (பல) பக்கங்களில் பயன்படுத்தப்படுகின்றன. கிளையண்ட் பக்க கேச்சிங் என்பது கோப்புகளின் நகல்களை (சேவையக பதில்கள்) மீண்டும் பதிவிறக்கம் செய்யாமல் சேமிக்கும் உலாவிகளின் திறனைக் குறிக்கிறது. இது பக்கத்தை மீண்டும் ஏற்றுவதை கணிசமாக விரைவுபடுத்தவும், போக்குவரத்தில் சேமிக்கவும் மற்றும் சேவையகத்தில் சுமையை குறைக்கவும் உங்களை அனுமதிக்கிறது.

கிளையன்ட் பக்க கேச்சிங் செயல்முறைகளைக் கட்டுப்படுத்த பல்வேறு HTTP தலைப்புகள் உள்ளன. அவை ஒவ்வொன்றையும் பற்றி பேசலாம்.

கிளையன்ட் கேச்சிங்கைக் கட்டுப்படுத்த Http தலைப்புகள்

முதலில், எந்த கேச்சிங் இல்லாத நிலையில் சர்வரும் உலாவியும் எவ்வாறு தொடர்பு கொள்கின்றன என்பதைப் பார்ப்போம். ஒரு தெளிவான புரிதலுக்காக, நான் அவர்களுக்கு இடையேயான தகவல்தொடர்பு செயல்முறையை உரை அரட்டை வடிவத்தில் கற்பனை செய்து காட்சிப்படுத்த முயற்சித்தேன். சேவையகமும் உலாவியும் ஒன்றுக்கொன்று ஒத்துப்போகும் நபர்கள் என்று சில நிமிடங்கள் கற்பனை செய்து பாருங்கள் :)

தற்காலிக சேமிப்பு இல்லாமல் (கேச்சிங் http தலைப்புகள் இல்லாத நிலையில்)

நாம் பார்க்க முடியும் என, ஒவ்வொரு முறை cat.png படம் காட்டப்படும் போது, ​​உலாவி அதை சர்வரில் இருந்து மீண்டும் பதிவிறக்கும். இது மெதுவானது மற்றும் பயனற்றது என்பதை விளக்க வேண்டிய அவசியமில்லை என்று நினைக்கிறேன்.

கடைசியாக மாற்றியமைக்கப்பட்ட பதில் தலைப்பு மற்றும் if-Modified-Since கோரிக்கை தலைப்பு.

கருத்து என்னவென்றால், சேவையகம் உலாவிக்கு வழங்கும் கோப்பில் (பதில்) கடைசியாக மாற்றியமைக்கப்பட்ட தலைப்பைச் சேர்க்கிறது.

டிசம்பர் 1, 2014 அன்று கோப்பு உருவாக்கப்பட்டது (அல்லது மாற்றப்பட்டது) என்பதை உலாவி இப்போது அறிந்திருக்கிறது. அடுத்த முறை உலாவிக்கு அதே கோப்பு தேவைப்படும்போது, ​​அது if-Modified-Since தலைப்புடன் கோரிக்கையை அனுப்பும்.

கோப்பு மாற்றப்படவில்லை என்றால், சேவையகம் 304 (மாற்றியமைக்கப்படவில்லை) என்ற நிலையுடன் உலாவிக்கு வெற்று பதிலை அனுப்புகிறது. இந்த வழக்கில், கோப்பு புதுப்பிக்கப்படவில்லை என்பதை உலாவி அறிந்திருக்கிறது மற்றும் கடைசியாக சேமித்த நகலைக் காண்பிக்க முடியும்.

இவ்வாறு, கடைசியாக மாற்றியமைக்கப்பட்டதைப் பயன்படுத்தி ஏற்றுவதில் சேமிக்கிறோம் பெரிய கோப்பு, சர்வரில் இருந்து வெற்று விரைவான பதிலுடன் இறங்குகிறது.

Etag மறுமொழி தலைப்பு மற்றும் If-None-Match கோரிக்கை தலைப்பு.

Etag இன் செயல்பாட்டுக் கொள்கை கடைசியாக மாற்றியமைக்கப்பட்டதைப் போலவே உள்ளது, ஆனால், அதைப் போலல்லாமல், அது நேரத்துடன் இணைக்கப்படவில்லை. நேரம் ஒரு உறவினர் விஷயம்.

யோசனை என்னவென்றால், அது உருவாக்கப்பட்டு ஒவ்வொரு முறையும் மாறும்போது, ​​​​சேவையகம் கோப்பை ETag எனப்படும் ஒரு சிறப்பு குறிச்சொல்லுடன் குறியிடுகிறது, மேலும் அது உலாவிக்கு அனுப்பும் கோப்பில் (பதில்) ஒரு தலைப்பைச் சேர்க்கிறது:

ETag: "686897696a7c876b7e"

தற்போதைய பதிப்பு கோப்பில் “686897696a7c876b7e”க்கு சமமான ETag உள்ளது என்பதை இப்போது உலாவி அறிந்துள்ளது. அடுத்த முறை உலாவிக்கு அதே கோப்பு தேவைப்படும்போது, ​​அது If-None-Match என்ற தலைப்புடன் கோரிக்கையை அனுப்பும்: "686897696a7c876b7e" .

பொருந்தவில்லை என்றால்: "686897696a7c876b7e"

சேவையகம் லேபிள்களை ஒப்பிட்டு, கோப்பு மாற்றப்படவில்லை எனில், உலாவிக்கு 304 (மாற்றியமைக்கப்படவில்லை) நிலையுடன் வெற்று பதிலை அனுப்பலாம். கடைசியாக மாற்றியமைக்கப்பட்டதைப் போலவே, கோப்பு புதுப்பிக்கப்படவில்லை என்பதையும், தற்காலிக சேமிப்பிலிருந்து ஒரு நகலைக் காண்பிக்க முடியும் என்பதையும் உலாவி கண்டறியும்.

தலைப்பு காலாவதியானது

இந்த தலைப்பின் செயல்பாட்டின் கொள்கை மேலே விவரிக்கப்பட்ட Etag மற்றும் கடைசியாக மாற்றியமைக்கப்பட்டதில் இருந்து வேறுபடுகிறது. காலாவதியானதைப் பயன்படுத்தி, கோப்பின் "காலாவதி தேதி" ("தொடர்புடைய காலம்") தீர்மானிக்கப்படுகிறது. அந்த. முதல் ஏற்றத்தில், காலாவதியான தேதியில் குறிப்பிட்ட தேதி வரை கோப்பை மாற்றத் திட்டமிடவில்லை என்பதை சர்வர் உலாவிக்குத் தெரியப்படுத்துகிறது:

அடுத்த முறை, உலாவி, "காலாவதி தேதி" இன்னும் வரவில்லை என்பதை அறிந்து, சேவையகத்திற்கு ஒரு கோரிக்கையை கூட செய்ய முயற்சிக்காது மற்றும் தற்காலிக சேமிப்பிலிருந்து கோப்பை காண்பிக்கும்.

கட்டுரைகள், ஐகான்கள், ஃபேவிகான்கள், சில css மற்றும் js கோப்புகள் போன்றவற்றிற்கான விளக்கப்படங்களுக்கு இந்த வகை கேச் மிகவும் பொருத்தமானது.

அதிகபட்ச வயது உத்தரவுடன் கேச்-கட்டுப்பாட்டு தலைப்பு.

கேச்-கட்டுப்பாட்டு செயல்பாட்டின் கொள்கை: அதிகபட்ச வயது காலாவதியானது. இங்கே, கோப்பின் "காலாவதி தேதி" தீர்மானிக்கப்படுகிறது, ஆனால் அது நொடிகளில் அமைக்கப்பட்டுள்ளது மற்றும் ஒரு குறிப்பிட்ட நேரத்துடன் இணைக்கப்படவில்லை, இது பெரும்பாலான சந்தர்ப்பங்களில் மிகவும் வசதியானது.

குறிப்பு:

• 1 நாள் = 86400 வினாடிகள்
• 1 வாரம் = 604800 வினாடிகள்
• 1 மாதம் = 2629000 வினாடிகள்
• 1 வருடம் = 31536000 வினாடிகள்

எ.கா:

Cache-Control: max-age=2629000;

கேச்-கண்ட்ரோல் ஹெடரில் அதிகபட்ச வயது தவிர மற்ற வழிமுறைகள் உள்ளன. மிகவும் பிரபலமானவற்றை விரைவாகப் பார்ப்போம்:

பொது
உண்மை என்னவென்றால், பயனரின் இறுதி கிளையன்ட் (உலாவி) மட்டுமல்ல, பல்வேறு இடைநிலை ப்ராக்ஸிகள், CDN நெட்வொர்க்குகள் போன்றவையும் கோரிக்கைகளை கேச் செய்ய முடியும். எனவே, பொது உத்தரவு எந்தவொரு ப்ராக்ஸி சேவையகத்தையும் உலாவியைப் போலவே தற்காலிகமாகச் செய்ய அனுமதிக்கிறது.

தனிப்பட்ட
என்று உத்தரவில் கூறப்பட்டுள்ளது இந்த கோப்பு(சேவையக பதில்) இறுதிப் பயனர் குறிப்பிட்டது மற்றும் பல்வேறு இடைநிலை ப்ராக்ஸிகளால் தேக்ககப்படுத்தப்படக்கூடாது. அதே நேரத்தில், இது இறுதி கிளையண்டிற்கு (பயனர் உலாவி) தற்காலிக சேமிப்பை அனுமதிக்கிறது. எடுத்துக்காட்டாக, உள் பயனர் சுயவிவரப் பக்கங்கள், அமர்வில் உள்ள கோரிக்கைகள் போன்றவற்றுக்கு இது பொருத்தமானது.

கிளையன்ட் ஒவ்வொரு முறையும் சேவையகத்திற்கு கோரிக்கை வைக்க வேண்டும் என்பதைக் குறிப்பிட உங்களை அனுமதிக்கிறது. சில நேரங்களில் மேலே விவரிக்கப்பட்ட Etag தலைப்புடன் பயன்படுத்தப்படுகிறது.

கடை இல்லை
எந்தவொரு சூழ்நிலையிலும் கோரிக்கையின் நகலையோ அல்லது கோரிக்கையின் பகுதிகளையோ வைத்திருக்கக் கூடாது என்று வாடிக்கையாளருக்கு அறிவுறுத்துகிறது. இது மிகவும் கட்டுப்படுத்தப்பட்ட தலைப்பு, எந்த தற்காலிக சேமிப்பையும் மீறுகிறது. இது ரகசிய தகவல்களுடன் பணிபுரிவதற்காக குறிப்பாக கண்டுபிடிக்கப்பட்டது.

மறுமதிப்பீடு செய்ய வேண்டும்
உள்ளடக்கத்தை (உதாரணமாக, நீங்கள் eTag ஐப் பயன்படுத்தினால்) மீண்டும் சரிபார்க்க சர்வரில் கட்டாயக் கோரிக்கையை வைக்குமாறு இந்த உத்தரவு உலாவிக்கு அறிவுறுத்துகிறது. உண்மை என்னவென்றால், http ஒரு குறிப்பிட்ட கட்டமைப்பில் ஏற்கனவே காலாவதியான உள்ளடக்கத்தை சேமிக்க கேச் அனுமதிக்கிறது. must-revalidate சேவையகத்திற்கு ஒரு கோரிக்கையை வைப்பதன் மூலம் எந்த சூழ்நிலையிலும் உள்ளடக்கத்தின் புத்துணர்ச்சியை சரிபார்க்க உலாவியை கட்டாயப்படுத்துகிறது.

பதிலாள்-மறுமதிப்பீடு
இது மறுபரிசீலனை செய்ய வேண்டும், ஆனால் கேச்சிங் ப்ராக்ஸிகளுக்கு மட்டுமே பொருந்தும்.

s-அதிகபட்சம்
இந்த உத்தரவு வெவ்வேறு ப்ராக்ஸிகளின் தற்காலிக சேமிப்பால் மட்டுமே கணக்கில் எடுத்துக்கொள்ளப்படுகிறது, ஆனால் பயனரின் உலாவியால் அல்ல. "s -" என்ற எழுத்து "பகிரப்பட்டது" (எ.கா. CDN) என்ற வார்த்தையிலிருந்து வந்தது. இந்த உத்தரவு குறிப்பாக CDNகள் மற்றும் பிற இடைநிலை தற்காலிக சேமிப்புகளுக்காக வடிவமைக்கப்பட்டுள்ளது. அதைக் குறிப்பிடுவது அதிகபட்ச வயது உத்தரவு மற்றும் காலாவதியான தலைப்பின் மதிப்புகளை மீறுகிறது. இருப்பினும், நீங்கள் CDN நெட்வொர்க்குகளை உருவாக்கவில்லை என்றால், உங்களுக்கு s-maxage தேவைப்பட வாய்ப்பில்லை.

ஒரு தளத்தில் என்ன தலைப்புகள் பயன்படுத்தப்படுகின்றன என்பதை நான் எப்படிப் பார்ப்பது?

உங்களுக்கு பிடித்த உலாவியின் பிழைத்திருத்தத்தில் http கோரிக்கை தலைப்புகள் மற்றும் பதில் தலைப்புகளை நீங்கள் பார்க்கலாம். Chrome இல் இது எப்படி இருக்கும் என்பதற்கான எடுத்துக்காட்டு இங்கே:

எந்த சுயமரியாதை உலாவி அல்லது http sniffer இல் இதையே காணலாம்.

Apache மற்றும் Nginx இல் தற்காலிக சேமிப்பை அமைத்தல்

பிரபலமான சர்வர்களை அமைப்பதற்கான ஆவணங்களை நாங்கள் மீண்டும் சொல்ல மாட்டோம். நீங்கள் அதை எப்போதும் பார்க்கலாம் மற்றும். உள்ளமைவு கோப்புகள் எப்படி இருக்கும் என்பதைக் காட்ட, சில நிஜ வாழ்க்கை உதாரணங்களை கீழே தருவோம்.

உதாரணமாக அப்பாச்சி கட்டமைப்புகள்காலாவதியை கட்டுப்படுத்த

நாங்கள் வெவ்வேறு "காலாவதி தேதிகளை" அமைத்துள்ளோம் பல்வேறு வகையானகோப்புகள். படங்களுக்கு ஒரு வருடம், ஸ்கிரிப்டுகள், ஸ்டைல்கள், pdfகள் மற்றும் ஐகான்களுக்கு ஒரு மாதம். மற்ற எல்லாவற்றிற்கும் - 2 நாட்கள்.

காலாவதியாகிறது. மாதம்" காலாவதியாகிறதுByType பயன்பாடு/pdf "அணுகல் மற்றும் 1 மாதம்" காலாவதியாகிறதுByType text/x-javascript "அணுகல் பிளஸ் 1 மாதம்" காலாவதியாகும்ByType படம்/x-ஐகான் "அணுகல் பிளஸ் 1 வருடம்" காலாவதியானது இயல்புநிலை "அணுகல் மற்றும் 2 நாட்கள்"

கட்டுப்படுத்துவதற்கான எடுத்துக்காட்டு Nginx உள்ளமைவு காலாவதியாகிறது

வெவ்வேறு வகையான கோப்புகளுக்கு வெவ்வேறு "காலாவதி தேதிகளை" அமைக்கிறோம். படங்களுக்கு ஒரு வாரம், ஸ்டைல்கள் மற்றும் ஸ்கிரிப்ட்களுக்கு ஒரு நாள்.

சேவையகம் ( #... இருப்பிடம் ~* \.(gif|ico|jpe?g|png)(\?+)?$ (1வா காலாவதியாகும்; ) இருப்பிடம் ~* \.(css|js)$ (1d காலாவதியாகும்; ) #...)

Cache-control க்கான Apache கட்டமைப்பு எடுத்துக்காட்டு (அதிகபட்ச வயது மற்றும் பொது/தனியார்/இல்லை-கேச்) தலைப்பு தொகுப்பு Cache-Control "max-age=2592000, public" Header set Cache-Control "max-age=88000, private, must- மறுமதிப்பீடு" தலைப்பு தொகுப்பு கேச்-கண்ட்ரோல் "தனியார், ஸ்டோர் இல்லை, கேச் இல்லை, மறுமதிப்பீடு செய்ய வேண்டும், மாற்ற முடியாது, அதிகபட்சம் வயது=0" தலைப்பு தொகுப்பு பிராக்மா "நோ-கேச்" Nginx கட்டமைப்பு உதாரணம் Cache-control நிலையான கோப்புகள் சர்வர் ( #... இடம் ~* \.(?:ico|css|js|gif|jpe?g|png)$ ( add_header Cache-Control "max-age=88000, public"; ) #... ) இல் முடிவுரை

"கேச் செய்யக்கூடிய அனைத்தையும் கேச் செய்" என்பது ஒரு வலை டெவலப்பருக்கு ஒரு நல்ல பொன்மொழியாகும். சில நேரங்களில் நீங்கள் உள்ளமைவில் சில மணிநேரங்களைச் செலவிடலாம், அதே நேரத்தில் உங்கள் தளத்தின் பயனர் அனுபவத்தை கணிசமாக மேம்படுத்தலாம், சேவையக சுமையை கணிசமாகக் குறைக்கலாம் மற்றும் போக்குவரத்தில் சேமிக்கலாம். முக்கிய விஷயம் என்னவென்றால், உங்கள் வளத்தின் பண்புகளை கணக்கில் எடுத்துக்கொண்டு, அதை மிகைப்படுத்தி, எல்லாவற்றையும் சரியாக அமைப்பது அல்ல.

சரியாக உள்ளமைக்கப்பட்ட கேச்சிங் மிகப்பெரிய செயல்திறன் பலன்களை வழங்குகிறது, அலைவரிசையைச் சேமிக்கிறது மற்றும் சர்வர் செலவைக் குறைக்கிறது, ஆனால் பல தளங்கள் கேச்சிங்கை மோசமாகச் செயல்படுத்துகின்றன, இது ஒன்றோடொன்று இணைக்கப்பட்ட வளங்களை ஒத்திசைக்காமல் செய்யும் ரேஸ் நிலையை உருவாக்குகிறது.

அறுதி பெரும்பான்மை சிறந்த நடைமுறைகள்கேச்சிங் என்பது இரண்டு வடிவங்களில் ஒன்றைக் குறிக்கிறது:

முறை எண். 1: மாறாத உள்ளடக்கம் மற்றும் நீண்ட அதிகபட்ச வயது தற்காலிக சேமிப்பு-கட்டுப்பாடு: அதிகபட்ச வயது=31536000

• URL இன் உள்ளடக்கம் மாறாது, எனவே...
• உலாவி அல்லது CDN ஒரு வருடத்திற்கு ஆதாரத்தை எளிதாக தேக்கிக்கொள்ள முடியும்
• குறிப்பிடப்பட்ட அதிகபட்ச வயதை விட குறைவான தற்காலிக சேமிப்பில் உள்ள உள்ளடக்கத்தை சேவையகத்துடன் கலந்தாலோசிக்காமல் பயன்படுத்தலாம்

பக்கம்: ஏய், எனக்கு "/script-v1.js" , "/styles-v1.css" மற்றும் "/cats-v1.jpg" 10:24 தேவை

பணம்: நான் காலியாக இருக்கிறேன், நீங்கள் எப்படி, சர்வர்? 10:24

சர்வர்: சரி, இதோ. மூலம், பணம், அவர்கள் ஒரு வருடம் பயன்படுத்த வேண்டும், இனி. 10:25

காசு: நன்றி! 10:25

பக்கம்: ஹர்ரே! 10:25

அடுத்த நாள்

பக்கம்: ஏய், எனக்கு "/script-v2 .js" , "/styles-v2 .css" மற்றும் "/cats-v1.jpg" 08:14 தேவை

பணம்: பூனைகளுடன் ஒரு படம் உள்ளது, ஆனால் மீதமுள்ளவை இல்லை. சர்வர்? 08:14

சர்வர்: எளிதானது - இதோ புதிய CSS & JS. மீண்டும், பணம்: அவர்களின் அடுக்கு வாழ்க்கை ஒரு வருடத்திற்கு மேல் இல்லை. 08:15

காசு: அருமை! 08:15

பக்கம்: நன்றி! 08:15

பணம்: ஹ்ம்ம், நான் சில காலமாக "/script-v1.js" & "/styles-v1.css" ஐப் பயன்படுத்தவில்லை. அவற்றை அகற்ற வேண்டிய நேரம் இது. 12:32

இந்த வடிவத்தைப் பயன்படுத்தி, ஒரு குறிப்பிட்ட URL இன் உள்ளடக்கத்தை நீங்கள் ஒருபோதும் மாற்ற மாட்டீர்கள், URLஐயே மாற்றுவீர்கள்:

ஒவ்வொரு URL லும் உள்ளடக்கத்துடன் மாறக்கூடிய ஒன்று உள்ளது. இது பதிப்பு எண், மாற்றியமைக்கப்பட்ட தேதி அல்லது உள்ளடக்க ஹாஷ் (எனது வலைப்பதிவிற்கு நான் தேர்ந்தெடுத்தது) இருக்கலாம்.

பெரும்பாலான சர்வர் பக்க கட்டமைப்புகளில் இது போன்ற விஷயங்களை எளிதாக செய்ய அனுமதிக்கும் கருவிகள் உள்ளன (ஜாங்கோவில் நான் மேனிஃபெஸ்ட் ஸ்டேடிக் கோப்புகள் சேமிப்பகத்தைப் பயன்படுத்துகிறேன்); அதே பிரச்சனைகளை தீர்க்கும் Node.js இல் மிகச் சிறிய நூலகங்களும் உள்ளன, எடுத்துக்காட்டாக, gulp-rev.

இருப்பினும், கட்டுரைகள் மற்றும் வலைப்பதிவு இடுகைகள் போன்ற விஷயங்களுக்கு இந்த முறை பொருத்தமானது அல்ல. அவற்றின் URLகளை பதிப்பு செய்ய முடியாது மற்றும் அவற்றின் உள்ளடக்கம் மாறலாம். தீவிரமாக, நான் அடிக்கடி இலக்கண மற்றும் நிறுத்தற்குறி பிழைகள் மற்றும் உள்ளடக்கத்தை விரைவாக புதுப்பிக்க வேண்டும்.

முறை #2: மாறக்கூடிய உள்ளடக்கம் எப்போதும் சர்வரில் சரிபார்க்கப்படும் Cache-Control: no-cache

• URL இன் உள்ளடக்கம் மாறும், அதாவது...
• சேவையகத்தைக் குறிப்பிடாமல் உள்நாட்டில் தேக்ககப்படுத்தப்பட்ட எந்தப் பதிப்பையும் பயன்படுத்த முடியாது.

பக்கம்: ஏய், எனக்கு "/about/" மற்றும் "/sw.js" இன் உள்ளடக்கங்கள் தேவை 11:32

காசு: என்னால் உங்களுக்கு உதவ முடியாது. சர்வர்? 11:32

சர்வர்: சில உள்ளன. பணம், அவற்றை உங்களுடன் வைத்திருங்கள், ஆனால் அவற்றைப் பயன்படுத்துவதற்கு முன்பு என்னிடம் கேளுங்கள். 11:33

காசு: சரியாக! 11:33

பக்கம்: நன்றி! 11:33

அடுத்த நாள்

பக்கம்: ஏய், எனக்கு மீண்டும் "/about/" மற்றும் "/sw.js" இன் உள்ளடக்கங்கள் தேவை 09:46

பணம்: ஒரு நிமிடம். சர்வர், எனது பிரதிகள் சரியாக உள்ளதா? "/about/" இன் நகல் திங்கள் மற்றும் "/sw.js" நேற்றையது. 09:46

சர்வர்: "/sw.js" மாறவில்லை... 09:47

பணம்: குளிர். பக்கம், "/sw.js" . 09:47

சேவையகம்:… ஆனால் என்னிடம் “/about/” உள்ளது புதிய பதிப்பு. காசு, பிடி, ஆனால் கடந்த முறை போல், முதலில் என்னிடம் கேட்க மறக்காதீர்கள். 09:47

காசு: புரிந்தது! 09:47

பக்கம்: அருமை! 09:47

குறிப்பு: நோ-கேச் என்றால் "கேச் செய்ய வேண்டாம்" என்று அர்த்தம் இல்லை, இது சர்வரில் உள்ள தற்காலிக சேமிப்பில் உள்ள ஆதாரத்தை "சரிபார்த்தல்" (அல்லது மறுமதிப்பீடு செய்தல்) என்று பொருள். மற்றும் எந்த ஸ்டோர்களும் உலாவியை தற்காலிகமாக சேமிக்க வேண்டாம் என்று கூறுகிறது. மேலும், கட்டாயம் மறுமதிப்பீடு என்பது கட்டாய மறுமதிப்பீடு என்று அர்த்தமல்ல, ஆனால் தற்காலிக சேமிப்பில் உள்ள வளமானது குறிப்பிட்ட அதிகபட்ச வயதை விட இளையதாக இருந்தால் மட்டுமே பயன்படுத்தப்படும், இல்லையெனில் அது மறுமதிப்பீடு செய்யப்படும். இப்படித்தான் தொடங்கியது முக்கிய வார்த்தைகள்தேக்ககத்திற்காக.

இந்த வடிவத்தில், பதிலில் ETag (உங்கள் விருப்பத்தின் பதிப்பு அடையாளங்காட்டி) அல்லது கடைசியாக மாற்றிய தலைப்பைச் சேர்க்கலாம். அடுத்த முறை க்ளையன்ட் உள்ளடக்கத்தைக் கோரும் போது, ​​முறையே, If-None-Match அல்லது If-Modified-Since அவுட்புட் ஆகும், இது "உங்களிடம் உள்ளதைப் பயன்படுத்தவும், உங்கள் தற்காலிக சேமிப்பு புதுப்பித்த நிலையில் உள்ளது" என்று கூறுவதற்கு சேவையகத்தை அனுமதிக்கிறது, அதாவது HTTP 304 ஐத் திருப்பி அனுப்பவும்.

ETag/Last-Modified ஐ அனுப்புவது சாத்தியமில்லை என்றால், சர்வர் எப்போதும் முழு உள்ளடக்கத்தையும் அனுப்பும்.

இந்த பேட்டர்னுக்கு எப்போதும் நெட்வொர்க் அழைப்புகள் தேவைப்படும், எனவே இது முதல் பேட்டர்னைப் போல் சிறப்பாக இல்லை, இது நெட்வொர்க் கோரிக்கைகள் இல்லாமல் செய்ய முடியும்.

முதல் வடிவத்திற்கான உள்கட்டமைப்பு எங்களிடம் இல்லை என்பது அசாதாரணமானது அல்ல, ஆனால் பேட்டர்ன் 2 இல் உள்ள பிணைய கோரிக்கைகளில் சிக்கல்கள் ஏற்படலாம், இதன் விளைவாக, ஒரு இடைநிலை விருப்பம் பயன்படுத்தப்படுகிறது: குறுகிய அதிகபட்ச வயது மற்றும் மாற்றக்கூடிய உள்ளடக்கம். இது ஒரு மோசமான சமரசம்.

மாறக்கூடிய உள்ளடக்கத்துடன் அதிகபட்ச வயதைப் பயன்படுத்துவது பொதுவாக தவறான தேர்வாகும்

மற்றும், துரதிருஷ்டவசமாக, இது பொதுவானது கிதுப் பக்கங்கள் ஒரு உதாரணம்.

கற்பனை செய்து பாருங்கள்:

• /கட்டுரை/
• /styles.css
• /script.js

சர்வர் தலைப்புடன்:

கேச்-கட்டுப்பாடு: மறுமதிப்பீடு செய்ய வேண்டும், அதிகபட்ச வயது=600

• URL உள்ளடக்கம் மாறுகிறது
• உலாவியில் 10 நிமிடங்களுக்கு மிக சமீபத்திய தற்காலிகச் சேமிப்பு பதிப்பு இருந்தால், அது சர்வரைக் கலந்தாலோசிக்காமல் பயன்படுத்தப்படும்
• அத்தகைய கேச் இல்லை எனில், முடிந்தால், இஃப்-மாடிஃபைட்-சின்ஸ் அல்லது இஃப்-ஒன்-மேட்ச் மூலம் நெட்வொர்க் கோரிக்கை பயன்படுத்தப்படும்.

பக்கம்: ஏய், எனக்கு "/article/", "/script.js" மற்றும் "/styles.css" 10:21 தேவை

காசு: உங்களைப் போல் என்னிடம் எதுவும் இல்லை, சர்வர்? 10:21

சர்வர்: பிரச்சனை இல்லை, இதோ. ஆனால் நினைவில் கொள்ளுங்கள், பணம்: அடுத்த 10 நிமிடங்களில் அவை பயன்படுத்தப்படலாம். 10:22

காசு: ஆமாம்! 10:22

பக்கம்: நன்றி! 10:22

பக்கம்: ஏய், எனக்கு மீண்டும் "/article/" , "/script.js" மற்றும் "/styles.css" தேவை 10:28

பணம்: அச்சச்சோ, மன்னிக்கவும், ஆனால் நான் "/styles.css" ஐ இழந்துவிட்டேன், ஆனால் என்னிடம் மற்ற அனைத்தும் உள்ளன, இதோ. சேவையகம், எனக்காக "/styles.css" ஐ தனிப்பயனாக்க முடியுமா? 10:28

சேவையகம்: எளிதானது, நீங்கள் அவரை கடைசியாக அழைத்துச் சென்றதிலிருந்து அவர் ஏற்கனவே மாறிவிட்டார். அடுத்த 10 நிமிடங்களுக்கு நீங்கள் அதைப் பாதுகாப்பாகப் பயன்படுத்தலாம். 10:29

பணம்: பிரச்சனை இல்லை. 10:29

பக்கம்: நன்றி! ஆனால் ஏதோ தவறு நடந்ததாகத் தெரிகிறது! எல்லாம் உடைந்துவிட்டது! என்ன நடந்து காெண்டிருக்கிறது? 10:29

இந்த முறை சோதனையின் போது வாழ்வதற்கான உரிமையைக் கொண்டுள்ளது, ஆனால் இது ஒரு உண்மையான திட்டத்தில் உள்ள அனைத்தையும் உடைக்கிறது மற்றும் கண்காணிப்பது மிகவும் கடினம். மேலே உள்ள எடுத்துக்காட்டில், சேவையகம் HTML, CSS மற்றும் JS ஐப் புதுப்பித்துள்ளது, ஆனால் பக்கம் பழைய தற்காலிகச் சேமிப்பு HTML மற்றும் JS மற்றும் சேவையகத்திலிருந்து புதுப்பிக்கப்பட்ட CSS உடன் ரெண்டர் செய்யப்பட்டது. பதிப்பு பொருத்தமின்மை எல்லாவற்றையும் அழிக்கிறது.

பெரும்பாலும் HTML இல் குறிப்பிடத்தக்க மாற்றங்களைச் செய்யும்போது, ​​புதிய கட்டமைப்பை சரியாகப் பிரதிபலிக்கும் வகையில் CSS மற்றும் உள்ளடக்கம் மற்றும் ஸ்டைலிங்கைத் தொடர JavaScript இரண்டையும் மாற்றுவோம். இந்த ஆதாரங்கள் அனைத்தும் சுயாதீனமானவை, ஆனால் கேச்சிங் தலைப்புகளால் இதை வெளிப்படுத்த முடியாது. இதன் விளைவாக, பயனர்கள் தங்களைக் கண்டறியலாம் சமீபத்திய பதிப்புஒன்று/இரண்டு ஆதாரங்கள் மற்றும் மீதமுள்ளவற்றின் பழைய பதிப்பு.

அதிகபட்ச வயது பதிலளிப்பு நேரத்துடன் தொடர்புடையது, எனவே அனைத்து ஆதாரங்களும் ஒரே முகவரியின் ஒரு பகுதியாக மாற்றப்பட்டால், அவை ஒரே நேரத்தில் காலாவதியாகிவிடும், ஆனால் ஒத்திசைவுக்கான சிறிய வாய்ப்பு இன்னும் உள்ளது. உங்களிடம் ஜாவாஸ்கிரிப்ட் இல்லாத பக்கங்கள் அல்லது பிற ஸ்டைல்கள் இருந்தால், அவற்றின் தற்காலிக சேமிப்பு காலாவதி தேதிகள் ஒத்திசைக்கப்படாமல் இருக்கும். மேலும் மோசமானது, உலாவியானது HTML, CSS & JS ஆகியவை ஒன்றையொன்று சார்ந்தவை என்பதை அறியாமல், தற்காலிக சேமிப்பில் இருந்து உள்ளடக்கத்தை தொடர்ந்து இழுக்கிறது, எனவே அது பட்டியலிலிருந்து ஒரு விஷயத்தை மகிழ்ச்சியுடன் இழுத்து மற்ற அனைத்தையும் மறந்துவிடும். இந்த எல்லா காரணிகளையும் ஒன்றாகக் கருத்தில் கொண்டு, பொருந்தாத பதிப்புகளின் நிகழ்தகவு மிகவும் அதிகமாக உள்ளது என்பதை நீங்கள் புரிந்து கொள்ள வேண்டும்.

பயனருக்கு, இதன் விளைவாக உடைந்த பக்க தளவமைப்பு அல்லது பிற சிக்கல்கள் இருக்கலாம். சிறிய குறைபாடுகளிலிருந்து முற்றிலும் பயன்படுத்த முடியாத உள்ளடக்கம் வரை.

அதிர்ஷ்டவசமாக, பயனர்களுக்கு அவசரகால வெளியேற்றம் உள்ளது...

பக்கத்தைப் புதுப்பித்தல் சில நேரங்களில் உதவுகிறது

புதுப்பித்தல் மூலம் பக்கம் ஏற்றப்பட்டால், உலாவிகள் எப்போதும் அதிகபட்ச வயதைப் புறக்கணித்து, சர்வர் பக்க மறுமதிப்பீட்டைச் செய்யும். எனவே, பயனர் அதிகபட்ச வயது காரணமாக ஏதேனும் உடைந்திருந்தால், ஒரு எளிய பக்க புதுப்பிப்பு எல்லாவற்றையும் சரிசெய்ய முடியும். ஆனால், நிச்சயமாக, ஸ்பூன்கள் கண்டுபிடிக்கப்பட்ட பிறகு, வண்டல் இன்னும் இருக்கும் மற்றும் உங்கள் தளத்திற்கான அணுகுமுறை சற்று வித்தியாசமாக இருக்கும்.

ஒரு சேவை பணியாளர் இந்த பிழைகளின் ஆயுளை நீட்டிக்க முடியும்

எடுத்துக்காட்டாக, உங்களிடம் இது போன்ற ஒரு சேவை பணியாளர் இருக்கிறார்:

கான்ஸ்ட் பதிப்பு = "2"; self.addEventListener("நிறுவு", நிகழ்வு => ( event.waitUntil(caches.open(`static-$(version)')) .then(cache => cache.addAll([ "/styles.css", "/script .js" ])));)); self.addEventListener("செயல்படுத்து", நிகழ்வு => (// ...பழைய தற்காலிக சேமிப்புகளை நீக்கவும்... )); self.addEventListener("fetch", event => ( event.respondWith(caches.match(event.request) .then(response => response || fetch(event.request))); ));

இந்த சேவை ஊழியர்:

• ஸ்கிரிப்ட் மற்றும் பாணிகளை தேக்ககப்படுத்துகிறது
• பொருத்தம் இருந்தால் தற்காலிக சேமிப்பைப் பயன்படுத்துகிறது, இல்லையெனில் பிணையத்தை அணுகுகிறது

CSS/JSஐ மாற்றினால், பதிப்பு எண்ணையும் அதிகரிக்கிறோம், இது புதுப்பிப்பைத் தூண்டும். இருப்பினும், addAll முதலில் தற்காலிக சேமிப்பை அணுகுவதால், அதிகபட்ச வயது மற்றும் பொருந்தாத CSS & JS பதிப்புகள் காரணமாக நாம் பந்தய நிலைக்கு வரலாம்.

அவை தற்காலிகமாகச் சேமிக்கப்பட்டவுடன், அடுத்த சேவைப் பணியாளர் புதுப்பிப்பு வரை எங்களிடம் இணக்கமற்ற CSS & JS இருக்கும் - மேலும் புதுப்பிப்பின் போது மீண்டும் ரேஸ் நிலைக்கு வராத வரை.

சேவை பணியாளரில் தற்காலிக சேமிப்பை நீங்கள் தவிர்க்கலாம்:

Self.addEventListener("நிறுவு", நிகழ்வு => ( event.waitUntil(caches.open(`static-$(version)')) .then(cache => cache.addAll([ new Request("/styles.css","), ( கேச்: "நோ-கேச்" )), புதிய கோரிக்கை("/script.js", ( கேச்: "நோ-கேச்" )) ])));

துரதிர்ஷ்டவசமாக, தற்காலிக சேமிப்பிற்கான விருப்பங்கள் Chrome/Opera இல் ஆதரிக்கப்படவில்லை மற்றும் Firefox இன் இரவு உருவாக்கத்தில் இப்போது சேர்க்கப்பட்டுள்ளது, ஆனால் அதை நீங்களே செய்யலாம்:

Self.addEventListener("நிறுவு", நிகழ்வு => ( event.waitUntil(caches.open(`static-$(version)')) .then(cache => Promise.all([ "/styles.css", "/script .js" ].map(url => (// கேச்-பஸ்ட் பயன்படுத்தி சீரற்ற வினவல் சரம் திரும்ப பெறுதல்(`$(url)?$(Math.random())`)).பின்(பதில் => ( // தோல்வி 404, 500 போன்றவற்றில் (!response.ok) எறர் ("சரியில்லை") திரும்ப கேச்.புட்(url, response )) )));

இந்த எடுத்துக்காட்டில், நான் ஒரு சீரற்ற எண்ணைப் பயன்படுத்தி தற்காலிக சேமிப்பை மீட்டமைக்கிறேன், ஆனால் நீங்கள் மேலும் சென்று உள்ளடக்கத்தின் ஹாஷைச் சேர்க்கலாம் (இது sw-precache செய்வது போன்றது). இது ஜாவாஸ்கிரிப்டைப் பயன்படுத்தும் முதல் வடிவத்தின் ஒரு வகையான செயல்படுத்தல் ஆகும், ஆனால் சேவைப் பணியாளருடன் மட்டுமே வேலை செய்கிறது, உலாவிகள் மற்றும் CDN அல்ல.

சேவை பணியாளர்கள் மற்றும் HTTP கேச் இணைந்து சிறப்பாக செயல்படுகின்றன, அவர்களை சண்டையிட வேண்டாம்!

நீங்கள் பார்க்க முடியும் என, உங்கள் சேவை பணியாளரில் உள்ள கேச்சிங் பிழைகளை நீங்கள் சுற்றி வேலை செய்யலாம், ஆனால் பிரச்சனையின் மூலத்தை தீர்ப்பது நல்லது. சரியான அமைப்புகேச்சிங் சேவை பணியாளரின் வேலையை எளிதாக்குவது மட்டுமல்லாமல், சேவை பணியாளர்களை (Safari, IE/Edge) ஆதரிக்காத உலாவிகளுக்கும் உதவுகிறது, மேலும் உங்கள் CDNல் இருந்து அதிகப் பலன்களைப் பெறவும் உங்களை அனுமதிக்கிறது.

சரியான கேச்சிங் தலைப்புகள் ஒரு சேவை பணியாளரைப் புதுப்பிப்பதை மிகவும் எளிதாக்கும்.

கான்ஸ்ட் பதிப்பு = "23"; self.addEventListener("install", event => ( event.waitUntil(caches.open(`static-$(version)')) .then(cache => cache.addAll([ "/", "/script-f93bca2c. js", "/styles-a837cb1e.css", "/cats-0e9a2ef4.jpg" ])));));

இங்கே நான் ரூட் பக்கத்தை பேட்டர்ன் #2 (சர்வர்-சைட் மறுமதிப்பீடு) மற்றும் பேட்டர்ன் #1 உடன் (மாறாத உள்ளடக்கம்) மற்ற எல்லா ஆதாரங்களையும் தேக்ககப்படுத்தினேன். ஒவ்வொரு சேவை பணியாளர் புதுப்பிப்பும் ரூட் பக்கத்திற்கு ஒரு கோரிக்கையை ஏற்படுத்தும், மேலும் அவர்களின் URL மாறியிருந்தால் மட்டுமே மற்ற எல்லா ஆதாரங்களும் ஏற்றப்படும். இது நல்லது, ஏனெனில் இது போக்குவரத்தைச் சேமிக்கிறது மற்றும் செயல்திறனை மேம்படுத்துகிறது, நீங்கள் முந்தையவற்றிலிருந்து மேம்படுத்துகிறீர்களா அல்லது மிகவும் அதிகமாக இருந்தாலும் சரி. பழைய பதிப்பு.

முழு பைனரியும் ஒரு சிறிய மாற்றத்துடன் பதிவிறக்கம் செய்யப்படும்போது அல்லது சிக்கலான ஒப்பீட்டை ஏற்படுத்தும் போது, ​​சொந்த செயலாக்கத்தில் குறிப்பிடத்தக்க நன்மை உள்ளது. பைனரி கோப்புகள். இந்த வழியில் நாம் ஒரு பெரிய வலை பயன்பாட்டை ஒப்பீட்டளவில் சிறிய சுமையுடன் புதுப்பிக்க முடியும்.

சேவைப் பணியாளர்கள் ஒரு தற்காலிக ஊன்றுகோலைக் காட்டிலும் ஒரு மேம்பாட்டிற்காகச் சிறப்பாகச் செயல்படுகிறார்கள், எனவே அதை எதிர்த்துப் போராடுவதற்குப் பதிலாக கேச் மூலம் வேலை செய்யுங்கள்.

கவனமாகப் பயன்படுத்தும்போது, ​​அதிகபட்ச வயது மற்றும் மாறக்கூடிய உள்ளடக்கம் மிகவும் நன்றாக இருக்கும்

மாறக்கூடிய உள்ளடக்கத்திற்கான அதிகபட்ச வயது பெரும்பாலும் தவறான தேர்வாகும், ஆனால் எப்போதும் இல்லை. எடுத்துக்காட்டாக, அசல் கட்டுரையின் அதிகபட்ச வயது மூன்று நிமிடங்கள். ஒரே கேச்சிங் பேட்டர்னைப் பயன்படுத்தும் பக்கத்தில் சார்புகள் எதுவும் இல்லாததால் ரேஸ் நிலை ஒரு பிரச்சனையல்ல (CSS, JS & படங்கள் பேட்டர்ன் #1 ஐப் பயன்படுத்துகிறது - மாறாத உள்ளடக்கம்), மற்ற அனைத்தும் இந்த வடிவத்தைப் பயன்படுத்தாது.

இந்த மாதிரியானது, நான் ஒரு பிரபலமான கட்டுரையை வசதியாக எழுத முடியும், மேலும் எனது CDN (கிளவுட்ஃப்ளேர்) சேவையகத்திலிருந்து சுமைகளை அகற்ற முடியும், புதுப்பிக்கப்பட்ட கட்டுரை கிடைக்கும் வரை நான் மூன்று நிமிடங்கள் காத்திருக்கத் தயாராக இருக்கும் வரை. பயனர்களுக்கு அணுகக்கூடியது.

இந்த முறை வெறித்தனம் இல்லாமல் பயன்படுத்தப்பட வேண்டும். நான் ஒரு கட்டுரையில் ஒரு புதிய பகுதியைச் சேர்த்து, அதை மற்றொரு கட்டுரையிலிருந்து இணைத்தால், நான் ஒரு சார்புநிலையை உருவாக்கினேன், அது தீர்க்கப்பட வேண்டும். பயனர் இணைப்பைக் கிளிக் செய்து, விரும்பிய பகுதி இல்லாமல் கட்டுரையின் நகலைப் பெறலாம். நான் இதைத் தவிர்க்க விரும்பினால், நான் கட்டுரையைப் புதுப்பிக்க வேண்டும், Cloudflare இலிருந்து கட்டுரையின் தற்காலிக சேமிப்பில் உள்ள பதிப்பை நீக்க வேண்டும், மூன்று நிமிடங்கள் காத்திருக்கவும், பின்னர் மற்றொரு கட்டுரைக்கான இணைப்பைச் சேர்க்கவும். ஆம், இந்த முறைக்கு எச்சரிக்கை தேவை.

சரியாகப் பயன்படுத்தினால், கேச்சிங் குறிப்பிடத்தக்க செயல்திறன் மேம்பாடுகளையும் அலைவரிசை சேமிப்பையும் வழங்குகிறது. நீங்கள் எளிதாக URL ஐ மாற்றலாம் அல்லது சர்வர் பக்க மறுமதிப்பீட்டைப் பயன்படுத்தினால், மாறாத உள்ளடக்கத்தை வழங்கவும். நீங்கள் தைரியமாக இருந்தால், உங்கள் உள்ளடக்கம் ஒத்திசைக்க முடியாத சார்புகளைக் கொண்டிருக்கவில்லை என நம்பினால், அதிகபட்ச வயது மற்றும் மாற்றக்கூடிய உள்ளடக்கத்தை கலக்கவும்.

வலைத்தளங்களில் மாற்றங்களைச் செய்யும் போது, ​​பக்கங்கள், css கோப்புகள் மற்றும் ஸ்கிரிப்ட்கள் (.js) ஆகியவற்றின் உள்ளடக்கங்கள் உலாவியால் தற்காலிகமாக சேமிக்கப்பட்டு நீண்ட காலத்திற்கு மாறாமல் இருக்கும் என்ற உண்மையை அடிக்கடி சந்திப்போம். செய்யப்பட்ட மாற்றங்கள் அனைத்து உலாவிகளிலும் பிரதிபலிக்க, வாடிக்கையாளர்களை F5 அல்லது Ctrl + F5 இன் சிக்கலான சேர்க்கைகளுக்கு பழக்கப்படுத்துவது அவசியம் என்பதற்கு இது வழிவகுக்கிறது. மேலும் அவ்வப்போது அவை அழுத்தப்படுவதை உறுதி செய்யவும்.

செயல்முறை மிகவும் கடினமானது மற்றும் சிரமமானது. ஒவ்வொரு முறையும் கோப்புகளை மறுபெயரிடுவதன் மூலம் நீங்கள் நிச்சயமாக சூழ்நிலையிலிருந்து வெளியேறலாம், ஆனால் மீண்டும் அது சிரமமாக உள்ளது.

எவ்வாறாயினும், அதே பெயர்களில் இருக்கவும், .css அல்லது .js கோப்புகளின் தற்காலிக சேமிப்பை நமக்குத் தேவைப்படும் நேரத்தில் மீட்டமைக்கவும் அனுமதிக்கும் ஒரு வழி உள்ளது. மற்றும் Ctrl + F5 பற்றி எப்போதும் மறந்து விடுங்கள்.

இதன் முக்கிய அம்சம் என்னவென்றால், கடைசியில் நமது .css அல்லது .js கோப்புகளுடன் ஒரு போலி அளவுருவை இணைப்போம், அதை அவ்வப்போது மாற்றி, உலாவியில் தற்காலிக சேமிப்பை மீட்டமைப்போம்.

இவ்வாறு, நுழைவு மூல குறியீடுஇப்போது இப்படி இருக்கும்:

186485 என்பது ஒரு தன்னிச்சையான கலவையாகும், அது அதே கோப்பை வெளியிடும், ஆனால் உலாவி அதை புதியதாக விளக்குகிறது, போலி அளவுருவுக்கு நன்றி ?186485

இப்போது, ​​​​ஒவ்வொரு முறையும் எங்கள் அளவுருவின் அனைத்து நிகழ்வுகளையும் மாற்றாமல் இருக்க, அதை ஒரு php கோப்பில் அமைப்போம், இது நமக்குத் தேவையான எல்லா இடங்களுடனும் இணைக்கப்படும்: