js多线程运行之web worker

众所周知,Js是单线程运行的,也就是运行完前一个函数之后,才能运行后一个函数。犹如单行道的车辆,其实这是js的一个短板,同时也导致了运行阻塞。虽然有时候我们可以通过定时器来并向执行代码,但这并不能真正解决问题。

在html5中有一个名为Web worker的api,它的产生就犹如人们发明了立交桥,使得js支持多线程运行。假设当前页面的代码为主线程,而创建Web worker则是为主线程开辟了另外一个新的子线程,因为是并行运行的,所以这个子线程不会阻塞主线程的执行。

Web worker是运行在后台的js,可以让web应用程序具备后台处理能力,即我们可以把一些非常复杂的运算、或一些很耗性能的js代码交给Web worker这个子线程来 继续阅读

发表在 前端技术 | 标签为 | 留下评论

HTML5离线存储

何为离线存储?或许你经常碰到手机没信号或者流量不够用的情况,又或者上班时分突然断网,当你尝试打开页面时,给你反馈的只有网络无法连接之类的提示。但是如果你之前打开过设置了离线存储的页面,那么你便可像有网络般浏览网页,这就是离线存储的功能,而且它可以缓存任何文件。

离线存储原理

在有网的情况,当一次访问设置了离线存储的网页时,服务器会根据离线的设置将有关,同时它也会根据离线设置将需要离线的文件发送一份到离线 继续阅读

发表在 前端技术 | 标签为 , | 留下评论

历史记录与 HTML5 history

我们知道,在javascript中history作为BOM的一部分提供了浏览器的历史记录。我们可以通过方法history.back()返回上一页,history.forward()前进一页,history.go()跳转到任何页。

我们还知道,ajax可以不重载页面刷新网页局部,频繁的ajax操作让它有一个缺陷,即无法记录浏览器的历史记录,很自然我们就无法使用前进或后退键回到上一个操作的界面。像下面给出的例子,“ajax载入新闻列表”,当我们浏览了每页新闻,希望通过回到上一页,但是通过后退键是无法做到,这就是问题的所在, 继续阅读

发表在 前端技术 | 标签为 , , , | 留下评论

saveSvgAsPng 将svg转换为图片

曾经有很多次萌发这样的想法,如果有这么一个功能,可以通过调用某个标签里代码,将这些代码在网页中展现的效果保存为图片,那将是多么酷的事。这篇文章介绍一个将页面svg转换为图片的js库—saveSvgAsPng,这个库只有4kb大小,另外通过此库保存的图片不仅仅局限于png格式,你可以通过调用它的函数来设置其他的图片格式。

首先来看下具体的demo吧:saveSvgAsPng应用实例 继续阅读

发表在 前端技术 | 标签为 , , , | 留下评论

使用svg和vml制作一个数据图形

前端图形开发越来越备受关注,或许近两年受html5中canvas元素的推动。对于前端来说,图形开发主要涉及有canvas、svg以及过气的vml。虽然它们很多特性都相同,但个人认为canvas更适合游戏方面的开发,而尽管svg很早(1999年)就被w3c提出,但其状态一直不温不火。为了兼容IE9以下的低版本浏览器,显然vml是我们无奈的选择。其实很多关于图形的js库,都采用将svg和vml封装起来,这样你在使用时并不需要关心这两种语法的具体实现,只需要传入相关数据(一般为json格式)便可在不同的浏览器生成相应的图表,比如highchart和raphaeljs 继续阅读

发表在 前端技术 | 标签为 , | 留下评论