जावास्क्रिप्ट लोडिंग और इनिशियलाइज़ेशन

मोबाइल वेब के आगमन के साथ, हमारा इंटरनेट फिर से खराब हो गया है, और उपकरण धीमा हैं। 3G, 4G, Wi-Fi ... - वे, बेशक, कहीं न कहीं हैं, लेकिन जब आपको वास्तव में इसकी आवश्यकता होती है, तो एक नियम के रूप में, गति मॉडेम मोड के पास चली जाती है और यह पता चलता है कि हमारे "पाषाण युग" मोबाइल डिवाइस सूचना के आधुनिक वॉल्यूम की स्थितियों में आते हैं। यहां तक ​​कि शहर के केंद्र में (हालांकि 15 वीं मंजिल पर), मोबाइल इंटरनेट आइकन जादू पत्र ई दिखा सकता है, यह संकेत देते हुए कि यह आपकी नसों को बर्बाद करने और पीड़ित नहीं करना बेहतर है। हर बार प्रतीक्षा करने की तुलना में किसी प्रकार की वेब सेवा के मूल संस्करण का उपयोग करना बेहतर है, लघु संदेश भेजने के लिए मेगाबाइट द्वारा अपलोड करें। वेब सेवा का मूल संस्करण ... स्पष्ट व्यापार विपणन, आवेदन दौड़। हालांकि, उपयोगकर्ता देशी वेब एप्लिकेशन चुनते हैं जो तेजी से चलते हैं, संसाधनों का एक गुच्छा डाउनलोड नहीं करते हैं, हालांकि उन्हें समय-समय पर इसे अपडेट करना होगा।

यह लेख जावास्क्रिप्ट के लोडिंग और आरंभीकरण को अनुकूलित करने के तरीकों के बारे में है।

सभी कोड का उपयोग नहीं किया जाता है।

मैंने उस कोड की मात्रा की पहचान करने के लिए थोड़ा शोध किया जो किसी उपयोगकर्ता द्वारा लोकप्रिय साइटों के विभिन्न मोबाइल संस्करणों के पहले पृष्ठ पर जाने पर उपयोग किया जाता है। इसके लिए, मैंने क्रोम + स्क्रिप्ट-कवर प्लगइन का उपयोग किया।

अस्पताल का औसत लगभग 40 प्रतिशत कोड का उपयोग करता है। ऐसी साइटें हैं जो डाउनलोड किए गए संसाधनों का 80% उपयोग करती हैं, लेकिन ऐसे भी हैं जो केवल 20% का उपयोग करते हैं। यदि आप कहते हैं कि "आप बाकी पृष्ठों पर कैश से उपयोग किया जाएगा" - डेवलपर्स के रूप में, हम जानते हैं कि इतना लोड क्यों किया जाता है, और एक साधारण उपयोगकर्ता हर बार इस सभी वॉल्यूम के लोड होने का इंतजार करता है, हालांकि उसे सिर्फ एक संदेश भेजने की जरूरत है अपने दोस्तों के लिए

कैश

मान लीजिए कि एक उपयोगकर्ता ने एक बार हमारे सभी संसाधनों को डाउनलोड किया था, उन्हें कैश किया गया था और अगली बार जब उन्होंने उन्हें डाउनलोड नहीं किया (समाप्ति: +300 साल एफटीडब्ल्यू)।

अब डेस्कटॉप वेब ब्राउज़र का कैश आकार 40-80MB है। यह राशि सक्रिय वेब सर्फिंग के एक घंटे और आधे हिस्से में छीनी जा सकती है, क्योंकि लगभग हर साइट अपने एक्सपायरों के साथ कैश में क्रॉल करना चाहती है: चित्रों और अन्य संदिग्ध संसाधनों में +300 साल और आपकी उपयोगी लिपियों को दबाएं। यह पहाड़ के राजा या भारतीय ट्रेन का एक प्रकार है। यहां तक ​​कि 400 एमबी डिस्क कैश में खराब होने पर, आप हर दिन एक ही स्क्रिप्ट और शैलियों को पंप कर सकते हैं।

मोबाइल के साथ, सब कुछ बदतर है - आईओएस सफारी में डिस्क कैश (केवल मेमोरी में) नहीं है, एंड्रॉइड के साथ यह 20 एमबी तक सीमित है।

अनुकूलन एप्लिकेशन

मैंने एक साधारण एप्लिकेशन बनाया - यह एक चैट प्रोटोटाइप है। हम बहुत कठोर परिस्थितियों में इसके डाउनलोड को तेज करने की कोशिश करेंगे - 7Kb / s की इंटरनेट स्पीड पर। सभी संस्करणों को यहाँ azproduction.github.com/loader-test पर देखा जा सकता है

अनुक्रमिक लोडिंग और निष्पादन

स्टार्टअप पर, हमारी स्क्रिप्ट लोड करने वाला एप्लिकेशन कोड कुछ इस तरह दिखता है:

<script src="js/b-roster.js"></script> <script src="js/b-dialog.js"></script> <script src="js/b-talk.js"></script> <script src="js/index.js"></script> 

हमारी स्क्रिप्ट्स लोड की जाती हैं और क्रमिक रूप से चलती हैं (वास्तव में, आधुनिक ब्राउज़रों में यह थोड़ा गलत है), 4 अनुरोध। यह अब तक सभी विकल्पों में से सबसे खराब है। उसकी प्रोफ़ाइल इस तरह दिखती है:

18 सेकंड ... इतना इंतजार मत करो ...

समानांतर डाउनलोड और निष्पादन

हम अपने कोड को एसिंक्स विशेषता को जोड़कर थोड़ा संशोधित करेंगे ताकि हमारी स्क्रिप्ट लोड हो और समानांतर में शुरू हो। कई अनुप्रयोगों के लिए, यह डाउनलोड विधि काम नहीं करेगी। स्क्रिप्ट में पिछले कोड पर निर्भरता हो सकती है।

  <script src="js/b-roster.js" async></script> <script src="js/b-dialog.js" async></script> <script src="js/b-talk.js" async></script> <script src="js/index.js" async></script> 

देखते हैं कि हमें क्या मिलता है

कुछ भी नहीं बदला है ... केवल डीओएम तैयार कार्यक्रम थोड़ी देर पहले आग लगाता है, लेकिन यह हमारी मदद नहीं करेगा। हमें काम करने के लिए आवेदन के लिए सभी कोड चाहिए।

समानांतर लोडिंग, अनुक्रमिक शुरुआत

आइए एक और "अनुकूलन" लागू करने का प्रयास करें, हम एक साथ लोड करेंगे, लेकिन क्रमिक रूप से चलेंगे। ऐसा करने के लिए, LAB.js लाइब्रेरी का उपयोग करें:

  <script type="text/javascript" src="vendors/LAB.min.js"></script> <script> $LAB .script("js/b-roster.js") .script("js/b-dialog.js") .script("js/b-talk.js") .wait() .script("js/index.js"); </script> 

और यह केवल बदतर हो गया:

ऐसा लगता है कि हम समानांतर में लोड कर रहे हैं - इसका मतलब है कि संसाधन लोडिंग अवरुद्ध नहीं होनी चाहिए, और सब कुछ थोड़ा सा होना चाहिए, लेकिन तेजी से।
वास्तव में, सभी आधुनिक ब्राउज़र समानांतर में पृष्ठ पर सभी लिपियों को लोड करते हैं, लेकिन दस्तावेज़ में घोषणा के क्रम में उन्हें क्रमिक रूप से चलाते हैं। यदि कोई स्क्रिप्ट आवश्यक से पहले आती है, तो उसका लॉन्च अवरुद्ध है। LAB.js के मामले में, हम वास्तव में ब्राउज़र का काम करते हैं, इस तथ्य के बावजूद कि LAB.js स्क्रिप्ट अन्य सभी लिपियों के लोडिंग को रोकती है, और यहां तक ​​कि कुछ वॉल्यूम भी लेती है।

हम इकट्ठा करते हैं और पैक करते हैं

आइए एक और बल्कि स्पष्ट अनुकूलन लागू करें - हम सभी स्क्रिप्ट को 1 फ़ाइल में एकत्रित करेंगे और इस कोड को कुछ मिनिफ़ायर के साथ संपीड़ित करेंगे।

 $ cat **/*.js > main.js $ java -jar yuicompressor.jar main.js -o main.min.js 

मुझे लगता है कि ये लाइनें कई से परिचित हैं, मैं YUI कंप्रेसर का उपयोग करता हूं, लेकिन मैं UglifyJs या क्लोजर कंप्रेसर का उपयोग करने की सलाह दूंगा

इस अनुकूलन का परिणाम अत्यंत स्पष्ट है। सिद्धांत रूप में, आगे अनुकूलन नहीं करना संभव है :) लेकिन! 9s ... - इतने सारे उपयोगकर्ता हर बार इंतजार नहीं करेंगे।

AppCache - ऑफ़लाइन संग्रहण

सामान्य कैश के विपरीत, यह प्रत्येक एप्लिकेशन के लिए व्यक्तिगत है और अन्य एप्लिकेशन इसके संसाधनों को बाहर निकालने में सक्षम नहीं होंगे। केवल एक चीज यह हो सकती है कि AppCache पर कुल कोटा समाप्त हो जाएगा या उपयोगकर्ता इसे साफ कर देगा। AppCache कई ब्राउज़रों द्वारा समर्थित है । हालाँकि इसे ऑफ़लाइन संग्रहण कहा जाता है, हम इसके संसाधनों का उपयोग ऑनलाइन काम करने के लिए कर सकते हैं।

इसे जोड़ना बहुत सरल है:

Appcache फ़ाइल के लिंक के साथ प्रकट विशेषता को पंजीकृत करने के लिए यह पर्याप्त है

 <html manifest="example.appcache"> </html> 

कैश में जाने वाले सभी संसाधनों को सूचीबद्ध करने के लिए यह फ़ाइल बनाएं (यह फ़ाइल का सबसे सरल संस्करण है)

 CACHE MANIFEST # v1 - 2011-08-13 http://example.com/index.html http://example.com/main.js 

और अपने वेब सर्वर की सेटिंग में, कुछ लाइनें लिखें ताकि फ़ाइल सही MIME प्रकार के साथ वापस आ जाए और कैश न हो

 AddType text/cache-manifest .appcache ExpiresByType text/cache-manifest "access plus 0 seconds" 

AppCache का उपयोग करना, आप तुरंत (अनावश्यक बैसाखी के बिना) उपयोगकर्ता को सूचित कर सकते हैं कि उसका आवेदन पुराना है और पृष्ठ को फिर से लोड करने के लिए कहें, या फिर से लोड करने के लिए एक प्रस्ताव पूछें। ब्राउज़र सभी नेटवर्क गतिविधि लेता है और कैश की जांच करता है - आपको केवल अपडेट करने वाले इवेंट की सदस्यता लेने और कैश की स्थिति की जांच करने की आवश्यकता है।

 if (window.applicationCache) { applicationCache.addEventListener('updateready', function() { if (confirm('An update is available. Reload now?')) { window.location.reload(); } }); //       if(window.applicationCache.status === window.applicationCache.UPDATEREADY) { if (confirm('An update is available. Reload now?')) { window.location.reload(); } } } 

AppCache के पेशेवरों
1. विश्वसनीय कैशिंग
2. ऑफ़लाइन काम करें
3. सरल संस्करण नियंत्रण
4. समय पर अद्यतन

AppCache की
1. डिस्क कोटा समाप्त हो सकता है
2. उपयोगकर्ता आपकी साइट को कैश का उपयोग करने की अनुमति नहीं दे सकता है (फ़ायरफ़ॉक्स के मामले में)
3. ऑनलाइन संसाधन कैश किए गए पृष्ठ पर तब तक उपलब्ध नहीं होंगे जब तक NETWORK:\n* पंजीकृत न हो NETWORK:\n*
4. यदि आप अचानक अपने .appcache फ़ाइल पर Expires +300 साल लगाते हैं - तो आपका उपयोगकर्ता स्थायी रूप से पुराने संस्करण पर अटक जाएगा
5. अन्य डोमेन पर पुनर्निर्देशन को विफलता के रूप में माना जाता है
AppCache www.alistapart.com/articles/application-cache-is-a-upoubag के कुछ और मिनिअल्स

मुझे VitaZheltyakov से कुछ टिप्पणियां डालने के लिए धन्यवाद:

- एफएफ में कॉन्फ़िगर किए गए मानक कैशिंग के साथ एप्लिकेशन कैश में फाइल अपडेट करना। - फाइलें अपडेट नहीं की जाएंगी।
- नेटवर्क और फालबैक सेक्शन में विशिष्ट लिंक (पैटर्न नहीं) डालें - निर्दिष्ट नहीं की गई सभी फाइलें बिल्कुल भी डाउनलोड नहीं होंगी।
- फ्रेम में, एप्लिकेशन कैश कैशिंग के साथ पृष्ठ को पहले खोलें - एप्लिकेशन को चक्रीय रूप से पृष्ठों को लोड करेगा।
- मुख्य पृष्ठ की एक ऑफ़लाइन प्रति के साथ काम करने की कोशिश करें, जहां प्रकट घोषित किया गया है - यह कार्यशील के रूप में कैश से लोड होगा।

मुझे लगता है कि यह अत्यंत स्पष्ट है कि जब हम आवेदन को कैश से लोड करेंगे तो क्या परिणाम प्राप्त होंगे - 0 अनुरोध, 0 बाइट। (.Appcache फ़ाइल डाउनलोड करने के लिए 1 अनुरोध की आवश्यकता हो सकती है)

AppCache पर अधिक
एमडीएन पर AppCache के बारे में एक लेख smallurl.com/mdn-appcache
AppCache अकसर किये गए सवाल appcachefacts.info
शुरुआती के लिए AppCache www.html5rocks.com/en/tutorials/appcache/beginner

चुनिंदा डाउनलोड

हालाँकि अब हमारे पास अच्छी कैशिंग है, लेकिन हमारे एप्लिकेशन को लोड करना इष्टतम से बहुत दूर है। हम अभी भी अतिरिक्त संसाधनों को लोड कर रहे हैं जो उपयोगकर्ता को अभी आवश्यकता नहीं हो सकती है। आलसी लोडिंग स्क्रिप्ट के साथ अनुकूलन लागू करें। हम AMD "पैटर्न" का उपयोग कर सकते हैं - अतुल्यकालिक मॉड्यूल परिभाषा और इस API को लागू करने वाले आवश्यकताएँ लाइब्रेरी

1. मुख्य भागों जहाज
2. बाकी जरूरत के अनुसार
3. ऑटो निर्भरता लोड हो रहा है
4. ...
5. लाभ

हम अपने एप्लिकेशन को 2 भागों में विभाजित कर सकते हैं - यह एक रोस्टर है जिसमें संपर्कों की सूची और एक संवाद है। रोस्टर को हमेशा दिखाया जाना चाहिए, और संवाद कम बार खुलता है, इसलिए हम इसे आवश्यक रूप से लोड करेंगे।

हमारा html ऐसा हो गया है

 <script data-main="js/amd/index" src="vendors/require.js"></script> 

हम प्रत्येक मॉड्यूल को आवश्यक के लिए आवश्यक आवरण में लपेटते हैं। Index.js के मामले में, यह इस तरह होगा:

 require(["b-roster"], function(Roster) { new Roster($('body')); }); 

और हम प्रत्येक लोड करने योग्य मॉड्यूल को दूसरे आवरण में लपेटेंगे:

 define(function () { //  -   return ModuleName; }); 

स्टार्टअप पर, हम केवल index.js और roster.js लोड करते हैं, और रोस्टर तत्व पर क्लिक करके हम शेष फ़ाइलों को लोड करते हैं:

 querySelector('.b-roster').addEventListener('click', function (e) { require(["b-dialog"], function(Dialog) { new Dialog(element); }); }, false); 

विचार और कार्यान्वयन सरल है, देखते हैं कि हमें क्या मिला:

पिछले परिणाम की तुलना में, हमने 2 और अनुरोध करना शुरू किया, हालांकि, स्क्रिप्ट की शुरुआती मात्रा 16.5Kb, 2.1 के समय से कम हो गई

यह दृष्टिकोण, निश्चित रूप से, एक महत्वपूर्ण ऋण है - उपयोगकर्ता को रोस्टर तत्व पर क्लिक करने के लिए 4 सेकंड इंतजार करना पड़ता है (ताकि बाकी स्क्रिप्ट लोड हो), जो निश्चित रूप से बहुत अच्छा नहीं है।

आलसी लोडिंग और आरंभीकरण

स्टार्टअप पर 7.4 सेकंड - यह, ज़ाहिर है, अब 18 नहीं है, बल्कि 3-5 सेकंड है, जिसे उपयोगकर्ता सहन कर सकता है।

लिपियों की मात्रा में वृद्धि के साथ, अनुप्रयोग का प्रारंभ समय, स्टार्टअप विलंबता भी बढ़ जाती है। तथ्य यह है कि स्टार्टअप में, हमारे ब्राउज़र को इस फ़ाइल में सूचीबद्ध सभी कार्यों, ऑब्जेक्ट्स, कंस्ट्रक्टर्स की व्याख्या और इनिशियलाइज़ करना पड़ता है, भले ही हमें फिलहाल उनकी आवश्यकता न हो। और 1 एमबी का फेरबदल जावास्क्रिप्ट का शुरुआती समय 3 सेकंड तक पहुंच सकता है, यह ब्राउज़र और डिवाइस के संसाधनों पर लोड पर निर्भर करता है। डेस्कटॉप ब्राउज़रों के लिए, यह आंकड़ा, बहुत कम (100-300ms) है।

अपने एप्लिकेशन का निर्माण करते समय, हम अपनी स्क्रिप्ट को स्ट्रिंग्स में बदल सकते हैं, और फिर, यदि आवश्यक हो, तो उन्हें छोड़ दें और कोड प्राप्त करें। हां, eval एक सामान्य लॉन्च की तुलना में धीमा है, लेकिन यह इनिशियलाइज़ेशन प्रारंभ के समय नहीं होता है, लेकिन जिस समय एप्लिकेशन चल रहा होता है, जो हमारे एप्लिकेशन को तेज़ी से शुरू करने की अनुमति देता है।

LMD

इस विचार के आधार पर, मैंने LMD - लेज़ी मॉड्यूल घोषणा का सिद्धांत बनाया और इसी नाम से एक और "बूटलोडर" बनाया। आलसी आरंभीकरण के अलावा, LMD दूसरों की तुलना में कई अन्य लाभ हैं:

2. नोड.जेएस-जैसे मॉड्यूल

एएमडी को हमें हर बार डिफाइन (लिखने) की आवश्यकता होती है, हालांकि हम बिना परिभाषित किए भी कर सकते हैं और कोड 1 में 1 के लिए कोड लिख सकते हैं जैसे कि Node.js बिना किसी रैपर और निर्यात के साथ जादू के बिना।

यह वही है जो index.js कोड LMD के अंतर्गत दिखता है:

 var $ = require().$, // require("undefined") Roster = require("b-roster"); new Roster($('body')); 

LMD पैकेज असेंबल करते समय, LMD स्वयं पहले से ही इस कोड को इसके लिए आवश्यक आवरण में लपेट देता है।

3. निर्मित कलेक्टर और पैकर

LMD में पहले से ही आपकी स्क्रिप्ट्स का एक बिल्ट-इन कलेक्टर और एक पैकर है। आपको अपनी सभी लिपियों को घोषित करने की आवश्यकता है जिन्हें पैकेज में शामिल किया जाना चाहिए:

 { "path": "./modules/", "modules": { "main": "index.js", "b-roster": "b-roster.js", "undefined": "utils.js", //     * "*": "*.js" } } 

एलएमडी उन्हें संपीड़ित और पैक करेगा, हालांकि, संपीड़न और पैकेजिंग वैकल्पिक हैं - आप उन्हें पूरी फ़ाइल के लिए या प्रत्येक मॉड्यूल के लिए अलग से प्रबंधित कर सकते हैं।

4. लचीले पुस्तकालय का आकार

Need.js-AMD के विपरीत, सभी LMD कोड आपके स्क्रिप्ट पैकेज में असेंबली के समय बिना किसी अनावश्यक इशारे के शामिल किए जाते हैं। आप लचीले ढंग से सभी प्रकार के अनुकूलन और "प्लगइन्स" को सक्षम या अक्षम कर सकते हैं। उदाहरण के लिए, यदि आपका कोड केवल आधुनिक मोबाइल उपकरणों में काम करेगा, तो आपको IE6 के लिए इन सभी हैक की आवश्यकता क्यों है! LMD में, इस "अनुकूलन" को आसानी से कॉन्फिगर किया जा सकता है। या आप सीएसएस को गतिशील रूप से लोड नहीं करना चाहते हैं - आपको अतिरिक्त कोड खींचने की आवश्यकता क्यों है? - विकल्प को अक्षम करें और कोड छोटा हो जाता है। LMD.js का न्यूनतम आकार केवल 288 बाइट्स है।

5. हॉट बिल्ड प्रोजेक्ट

ऐसे वेब अनुप्रयोग हैं जिन्हें हर बार जांचने की आवश्यकता होती है कि क्या हुआ। LMD भी इससे ग्रस्त है, लेकिन यह आपको हर बार सर्वर पर एक मुश्किल निर्माण make या धुन करने के लिए मजबूर नहीं करता है। आपको केवल घड़ी मोड में एलएमडी शुरू करने की आवश्यकता है और हर बार जब आप विधानसभा में शामिल किसी भी फ़ाइल को बदलते हैं, तो एलएमडी पूरे प्रोजेक्ट को फिर से इकट्ठा करेगा।

 $ lmd watch config.lmd.json output.js 

6. स्मार्ट कलेक्टर

मैं LMD.js से एक स्मार्ट कलेक्टर बनाने की कोशिश करता हूं जो असेंबली के दौरान संभावित त्रुटियों को इंगित कर सकता है - ParseError, कॉन्फ़िगरेशन में अनुपलब्ध / अतिरिक्त ध्वज, आलसी मॉड्यूल में ग्लोबल्स का प्रत्यक्ष उपयोग और अन्य अनुकूलन।

बहुत सारे प्लस हैं, लेकिन वास्तव में क्या:

एएमडी की तुलना में, हमने वॉल्यूम को एक और 13.5 Kb से कम कर दिया, शुरुआत समय 2.1s, और 2 द्वारा अनुरोधों की संख्या।

पहले मामले की तुलना में, हमें आश्चर्यजनक परिणाम मिले:

निष्कर्ष

1. AppCache का उपयोग करें, लेकिन सावधानी के साथ
AppCache एक काफी सरल अनुकूलन है, जो परियोजना कोड को बदले बिना, आपके वेब एप्लिकेशन में एक अच्छा कैश जोड़ देगा। AppCache में कई समस्याएं हैं जिनके बारे में आप यहां पढ़ सकते हैं Application Cache एक डॉयचेग है । यदि आप अपने संसाधनों की एक सूची एकत्र करने या कुछ स्क्रिप्ट लिखने के लिए बहुत आलसी हैं, तो आप टूल का उपयोग कर सकते हैं कन्फ़र्म टिनीलरल. com/ confessjs जो आपके लिए यह सब करेगा और इसके अलावा, आपके सीएसएस चयनकर्ताओं को प्रोफ़ाइल करेगा।

2. स्क्रिप्ट लीजिए
यह सबसे अधिक लागत प्रभावी अनुकूलन है, अगर आप अभी तक स्क्रिप्ट को संपीड़ित नहीं कर रहे हैं - पढ़ना बंद करें और अंत में एक मेक फाइल लिखें :)

3. LMD या AMD का उपयोग करना शुरू करें
मौजूदा एप्लिकेशन LMD या AMD में अनुवाद करना काफी मुश्किल है, लेकिन अगर आप लिखना शुरू करते हैं, तो ऐसा करना आपके उपयोगकर्ताओं और डेवलपर्स दोनों के लिए सरल और लाभदायक है। आलसी लोडिंग के अलावा, आपको पूरी तरह से पृथक मॉड्यूल भी मिलते हैं, जो टीम वर्क में बहुत फायदेमंद है।

कोई लिंक

आवेदन हमने azproduction.github.com/loader-test को अनुकूलित किया है

उपकरण और स्क्रिप्ट
LMD github.com/azproduction/lmd
छोटे से स्वीकार करें
आवश्यकता है
यूआईई कंप्रेसर टिनीलरल.com/yui- compressor
क्या मैं caniuse.com का उपयोग कर सकता हूं
स्क्रिप्ट-कवर कोड. google.com/p/script-cover
UglifyJS github.com/mishoo/UglifyJS
प्रकटीकरण ompiler code.google.com/p/closure-compiler

AppCache द्वारा
एमडीएन पर AppCache के बारे में एक लेख smallurl.com/mdn-appcache
AppCache अकसर किये गए सवाल appcachefacts.info
शुरुआती के लिए AppCache www.html5rocks.com/en/tutorials/appcache/beginner
AppCache मुद्दे अनुच्छेद www.alistapart.com/articles/application-cache-is-a-douchebag

PS यह डीयूएमपी 2012 में मेरी रिपोर्ट का एक विस्तारित संस्करण है

UPD AppCache समस्याएं जोड़ी गईं , उपयोगी लिंक और युक्तियों के लिए धन्यवाद येरमिएव और वीटाज़ेल्टीताकोव ।