How does Html5 cache work?

Asked

Viewed 444 times

3

I have a webapp and I would like it to have a cache so that I don’t keep accessing it all the time. My webapp constitutes an index.html that parses on other websites. So every time the webapp opens it loads and parses on the site.

How I could apply a cache to improve usability?

follows the code you click on the 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>
html5 cache

1 answer

2

With HTML 5 it is possible to cache a full page or make use of a file CACHE MANIFEST for such.

For the browser to cache the page only, 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 file CACHE MANIFEST on your server and property manifest tag <html> point to the full URL of this file, after enabling mime-type text/cache-manifest on your server.

More information see the links below:

http://www.html5rocks.com/pt/tutorials/appcache/beginner/

http://www.w3.org/TR/2011/WD-html5-20110525/offline.html

  • Is there an example I can see? I’m using this in phonegap.html does not have a server. for example I add the manifest in html and point to a cache file. But if there is a connection it will connect first and then take the cache? has some timeout?

Browser other questions tagged html5 cache

You are not signed in. Login or sign up in order to post.