App Cache API - Quick JavaScript Interview Questions (2015)

Quick JavaScript Interview Questions (2015)

Chapter 15. App Cache API

Q. What is app cache? What are the benefits of using app cache API in a web application?
ANSWER
App cache API is the new feature provided by the HTML5.This API power up a web application working without an internet connection. The most important benefits by this API are listed below:

Speed : Like all other cache it increases the speed of accessing the page content.
Offline browsing: It increases the usability of application as it can be accessed without internet.
Reduced load: As the content and data is now cache in the browser the load of the application is reduced form the server.

Few network calls: As most of reusable content is present in app cache it this reduces the no of network call to the server.

Q. How to enable application cache in an html file?
ANSWER
To enable application cache in a HTML file we need to have manifest attribute in <HTML> element containing the name of the appcache file. The syntax of declaring application cache in HTML file is as follows.

<!DOCTYPE HTML>
<html manifest="filename.appcache"> </html>

Q. What is the media type of appcache file?
ANSWER
A manifest file needs to have text/cache-manifest media type.

Q. What are the 3 different section of manifest file?

ANSWER
A manifest file has 3 different sections. These 3 different sections are as follows.

CACHE MANIFEST : Files listed under this header will be cached after they are downloaded for the first time. NETWORK: Files listed under this header require a connection to the server, and will never be cached. FALLBACK: Files listed under this header specifies fallback pages if a page is inaccessible.

Q. What is NETWORK section?
ANSWER
NETWORK is one of the sections in manifest file. The file name

listed in the NETWORK section is never cached locally. The following code shows a sample of NETWORK section.
NETWORK: login.html

Q. What is FALLBACK section?
ANSWER
FALLBACK is one of the sections in manifest file. In this section we

can mention the file name which will be called when application is offline. The following code shows a sample of FALLBACK section.
FALLBACK:
/html/ /offline.html

Q. What is CACHE MANIFEST section?
ANSWER
CACHE MANIFEST is one of the sections in manifest file. The file names mentioned in this section is cached locally. The following code shows a sample of CACHE MANIFEST section.

/style.css
/favicon.gif /app.js

Q. How to view app cache detail in chrome browser?
ANSWER
We can view the app cache content like what it is caching, size and time etc. using the following link in chrome browser.

chrome://appcache-internals/.
The following screenshot shows the appcache internal for my browser.

Q. How to detect the support of browser for appcache? ANSWER
We can detect the support of appcache by checking the existence of applicationCache in window object. We can use javascript if statement which checks the truth value of
window.applicationCache object. The following screenshot shows the chrome console detecting applicationCache object.

Q. How to update the appcache manually?
ANSWER
We can update the cache by doing hard reload to the browser. We can also call swapCache() method to programmatically update the cache.