HTML5 Application Cache in Hindi

Posted on by

आज के इस HTML Tutorial in Hindi में आप Html5 Application cache feature का उपयोग करके offline application बनाना सीखेंगे |

Contents hide
1 What is application cache in HTML ?
2 Caching Files with a Manifest in HTML
2.1 Step 1 : Cache manifest file create kare
2.2 Step 2 : Cache Manifest File use kare

What is application cache in HTML ?

आमतौर पर अधिकांश web आधारित application तभी काम करती है जब आप online हो , लेकिन HTML5 ने application cache mechanism को पेश किया है जो offline application run करने के लिए जरुरी HTML file और अन्य सभी resources को save करने की web browser को अनुमति देता है |

HTML5 application cache उपयोग करने के कुछ फायदे निम्नलिखित है :

  • Offline browsing :- Internet connection में अनपेक्षित disruptions हुआ हो या user offline हो तब भी application का उपयोग कर सकता है |
  • Improve performance :- cached resources server के बजाय सीधे user के local machine से load होते है इसलिए web pages fast load होते है और बहेतर प्रदर्शन करते है |
  • Reduce HTTP request and server load :- इसमें web browser को server से उन्ही data को दुबारा download करने की जरूरत होती है जो updated या change किये गए हो | यह process HTTP request को कम कर देता और bandwidth को save करता है साथ ही server का load भी काफी हद तक कम कर देता है |

Caching Files with a Manifest in HTML

Offline उपयोग के लिए file को cache करना होता है और उसके लिए आपको निचे दिए गए steps को follow करना होगा |

Step 1 : Cache manifest file create kare

manifest एक विशेष text file है , जो web browser को बताती है की कौन सी files store करनी है , कौन सी files store नहीं करनी है , और कौन सी files replace करनी है | manifest files हमेशा CACHE MANIFEST ( uppercase ) शब्दों से शुरू होती है |

CACHE MANIFEST
# v1.0 : 10-08-2014
 
CACHE:
# pages
index.html
 
# styles & scripts
css/site-theme.css
js/site-jquery.min.js
js/site-default.js
 
# images
/favicon.ico
images/tech-samundra-logo.png
 
NETWORK:
login.php
 
FALLBACK:
/ /offline.html

आप सोच रहे होंगे की यह सब code क्या है | चलो इसे समझने की कोशिश करते है |

एक manifest file में three section हो सकते है : CACHE , NETWORK , और FALLBACK

  • CACHE: section header के तहत ( या CACHE MANIFEST line के तुरंत बाद ) listed files पहली बार download होने के बाद स्पष्ट रूप से cache की जाती है |
  • NETWORK: section header के तहत listed files white-listed resources है, जो कभी भी cache नहीं होते है और offline उपलब्ध नहीं होते है | ऊपर दिए गए code में NETWORK: section में login.php file दर्शाई है – इसका मतलब यह है की user तभी loging कर सकते है जब वे online हों |
  • यदि server connection established नहीं किया जा सकता है तो FALLBACK: section उन fallback pages को निर्दिष्ट करता है जिनका उपयोग browser को करना चाहिए | इस section में प्रत्येक entry में दो URIs list है – पहला primary resource और दूसरा fallback है | हमारे इस केस में यदि यूजर offline है तो offline.html page दिखेगा |
  • जो line # symbol से start हुई है वह comment line है |

Step 2 : Cache Manifest File use kare

cache manifest file बनाने के बाद उसे web server पर अपलोड करे – लेकिन पहले सुनिश्चित करे की web server को MIME type के साथ configured किया गया है , ताकि manifest file को serve किया जा सके |

MIME type को AddType text/cache-manifest line add करके set किया जा सकता है |

अब अपने cache manifest को प्रभावी बनाने के लिए , आपको इसे <html> element में manifest attribute को add करके web page में enable करना होगा | जैसे की निचे के code में दर्शाया गया है |

<!DOCTYPE html>
<html lang="en" manifest="examplefile.appcache">
<head>
    <title>Using the Application Cache</title>
</head>
<body>
    
</body>
</html>

Note :- apache web server पर, manifest files के लिए MIME type ( .appcache ) को application की root directory के .htaccess file में add करके set किया जा सकता है |

यह भी पढ़े :-