美文网首页
web存储和HTML5应用与Web Workers

web存储和HTML5应用与Web Workers

作者: IO大仙 | 来源:发表于2017-12-06 18:12 被阅读0次

    web存储主要有两个标签来实现:关于标签学习理解的一点想法,主要到这个阶段一定要理解标签的应用和理解,知道标签的含义以及正确应用。

    web存储理解:

    客户端存储数据的新方法

    1.localStorage函数 

    没有时间限制的数据存储

    2.sessionStorage函数

    有时间限制的数据存储,以浏览器关闭为限制(直接初始化数据消失),浏览器刷新还在储存

    这两种函数与cookie效果一样,但cookie不适合大数据的储存,因为它们由每个对服务器的请求来1传递,这使得cookie速度很慢而且效率也不高

    cookie函数的时间是由自己设定的,设定的时间如一天一年一月等,而不是浏览器关闭等不确定的时间段

    下面是代码:

    1.localStorage函数

    html部分 js部分

    这个代码的textarea的标签好像有问题,在浏览器中不会进行保存.........

    2.sessionStorage函数

    html部分 js部分

    这一部分的代码正确,作者已验证,理解js部分看注解

    HTML5应用与Web Workers

    当然在介绍这部分知识之前,需要介绍一些什么是服务器访问

    这里,我用的是本地服务器XAMPP

    XAMPP下载官网

    如何使用,如何安装非常简单,可以百度。

    使用本地服务器在浏览器中显示网页主要是在localhost/+文件本地路径

    而且之前要打开服务器服务

    1.什么是应用程序缓存:

    HTML5引入应用程序缓存,这意味着web应用可进行缓存,并可在没有因特网连接时进行访问

    2.应用缓存的优势:

    1):离线浏览 - 用户可在应用离线时使用它们

    2):速度 -已缓存资源加载更快

    3):减少服务器负载 - 浏览器将只从服务器下载更新过的资源

    3.实现缓存:

    如需启动应用程序缓存,请在文档的<html>标签中包含manifest属性

    manifest文件的建议的文件扩展名是:“.appcache”

    4.Manifest文件:

    1):CACHE MANIFEST -在此标题下列出的文件将在首次下载后进行缓存

    测试代码:


    html5


    缓存文件

    测试代码,自己去体验,当不加manifest="index.appcache"时关闭服务器,刷新后网页丢失

    有manifest="index.appcache"则,网页不丢失

    2):NETWORK -在此标题下列出的文件需要与服务器连接,且不会被缓存


    不缓存CSS

    用chrome审查元素来查询!

    3):FALLBACK -在此标题下列出的文件规定当页面无法访问时的回退页面(默认404页面)


    无法访问时,退回FALLBACK的下面文件的界面

    我学习的教程没有循环渐进的方式,这部分理解不容易,我已经搞了两天了!!!你们有好的教材可以推荐一本


    1.web worker是运行在后台的JavaScript,独立于其他脚本,不会影响页面的性能

    当我们的程序创建一个新程序时存在一个线程,支持我们陈序的运行,就是主线程,主线程的作用就是响应UI的操作,用web workers处理解决线程卡顿......扩展就到这里了!!我也不懂

    重点就是用web workers可接解决线程卡顿,响应用户界面会流畅许多

    2.函数

    postMessage() -它用于向HTML页面传回一段消息

    terminate() -终止 web worker,并释放浏览器/计算机资源

    3.事件:

    onmessage

    postMessage(countNUm);//传递/回传信息 不会影响主UI的操作

    html count.js index.js

    相关文章

      网友评论

          本文标题:web存储和HTML5应用与Web Workers

          本文链接:https://www.haomeiwen.com/subject/iphlixtx.html