How does the cache work in html5?

3

I have a webapp and would like it to have a cache so it will not be accessed at all times. My webapp consists of an index.html that does parse on other sites. So every time the webapp is opened it loads and parses the site.

How could I apply a cache to improve usability?

follow the code that loads on head:

<head>
 <script src="js/jquery-2.1.0.js" type="text/javascript"></script>
    <script>
        // O charset do site original é "iso-8859-1", isso arruma erros:
        $.ajaxSetup({
            'beforeSend': function(xhr) {
                xhr.overrideMimeType('text/html; charset=iso-8859-1');
            },
        });

        $.ajax('http://www.corsproxy.com/m.jcnet.com.br/cinema/')
                .done(function(data) {
                    var dom = $(data);

                    $('output').empty();

                    // O site é bem desorganizado, procurar dados nele
                    // é um tanto complicado, mas possível:
                    dom.find('.descricao').each(function() {
                        var item = $(this);

                        // Limpa dados desnecessários:
                        item.find('.font12').remove();

                        // Adiciona o título:
                        $('<h2>', {text: item.prev().find('strong').text()})
                                .appendTo('output');

                        // Adiciona a imagem:
                        item.find('td.fontPreto img').first().appendTo('output');

                         $('<br>').appendTo('output');

                        // Adiciona dados do filme:
                        item.find('p').appendTo('output');

                        $('<br>').appendTo('output');
                    });
                })
                .fail(function(error) {
                    $('output').insertBefore('<b>É um erro, Bino.</b>')
                });
                //Agradecimentos ao user  @Gustavo Rodrigues, por ter feito essa belezinha e me explicado como funciona >:)
    </script>
</head>
    
asked by anonymous 12.03.2014 / 13:49

1 answer

2

With HTML 5 it is possible to cache an entire page or make use of a CACHE MANIFEST file to do so.

For the browser to create the page-only cache, its HTML tag should look like this:

<html manifest="exemplo.appcache">

To create a cache of more than one file (your jquery script for example), you need to create a CACHE MANIFEST file on your server and the manifest property of the <html> tag point the full URL of that file after enable mime-type text/cache-manifest on your server.

More information see the links below:

link

link

    
12.03.2014 / 15:52