① HTML5 Web Socket和Web Worker的区别以及使用方法
一、WEB SOCKET
1、Web Socket是一种协议、本质上和http、tcp一样、协议是用来说明数据是如何传输的,写过一个小的在线聊天使用了socket.io、之后总结这个项目
2、Web Socket的前缀有两种：（1）ws:// 不是加密的、 (2)wss:// 是加密的
3、客户端和服务端进行Web Socket交互的方式也可以理解为“http握手 tcp数据传输”的方式
（1）浏览器（支持Websocket的浏览器）像HTTP一样、发起一个请求、然后等待服务端的响应
（2）服务器返回握手响应、告诉浏览器请将后续的数据按照websocket制定的数据格式传过来
（3）浏览器和服务器的socket连接不中断、此时这个连接和http不同的是它是双工的了
（4）浏览器和服务器有任何需要传递的数据的时候使用这个长连接进行数据传递
注
HTTP握手：是因为浏览器和服务器在建立长连接的握手过程是按照HTTP1.1的协议发送的、有Request、Request Header、 Response、 Response Header、但是不同的是Header里面的字段是有特定含义的
TCP传输: 主要体现在建立长连接后、浏览器是可以给服务器发送数据、服务器也可以给浏览器发送请求的、当然它的数据格式并不是自己定义的、是在要传输的数据外层有ws协议规定的外层包的
4、数据传输过程:websocket的数据传输形式是：frame、比如会将一条消息分为几个frame、按照先后顺序传输出去、这样做会有几个好处
（1）大数据的传输可以分片传输、不用考虑到数据大小导致的长度标志位不足够的情况
（2）和http的chunk一样、可以边生成数据边传递消息、即提高传输效率
5、客户端使用Web Socket的语法：JavaScript、服务端：多种web框架支持
二、WEB WORKER
1、当在 HTML 页面中执行脚本时、页面的状态是不可响应的、直到脚本已完成、而Web Worker 是运行在后台的 JavaScript、独立于其他脚本、不会影响页面的性能、您可以继续做任何愿意做的事情：点击、选取内容等等、而此时 Web Worker 在后台运行
除了DOM操作之外、理论上任何JS脚本任务都可放入worker中执行；语法上的限制、则是不能跨域访问JS、worker常用于需要消耗大量时间和CPU资源的复杂计算、以换来前台用户操作的友好型；换句话说、从用户体验上看、提高了服务性能
2、Web Worker使用：(当我们创建 Web Worker 对象后、它会继续监听消息（即使在外部脚本完成之后）直到其被终止为止）
（1）通过向 Web Worker 添加一个 "onmessage" 事件监听器来获取接受到的消息
（2）发送消息：postMessage()
（3）终止 Web Worker、并释放浏览器/计算机资源: terminate()
② web worker 一般应用于什么场景
WebWorker为Web应用程序提供了一种能在后台中运行的方法。通过WebWorker可以生成多个线程同时运行，并保证页面对用户的及时响应，完全不会影响用户的正常操作。在WebWorker中，不能直接对DOM进行操作。怎么用的话，去看下相关的视频，比如说“
③ QWebWorker
是不是病毒呢？
④ 用WebSocket，WebWorker和requestAnimationFrame如何实现服务端定时推送随机数到客户端
你使用WebSocket就可以达到这个效果。WebWorker是优化的事情，requestAnimationFrame只和显示有关。
后端@ServerEndpoint的类里面对应前端的new WebSocket("ws://localhost:8080/websocket");
在后端的定时推送有两个办法
1、@OnOpen方法里面为每个webSocket创建一个线程去做定时及推送
2、@OnOpen将webSocket加入一个SET或者List，服务启动的时候就启动一个线程，定时为SET里面的所有webSocket发送随机数。
⑤ Web前端最全面试宝典- Html篇
HTML
1.对WEB标准以及W3C的理解与认识
标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外 链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维 护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性；
2.xhtml和html有什么区别
HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言
最主要的不同：
XHTML 元素必须被正确地嵌套。
XHTML 元素必须被关闭。
标签名必须用小写字母。
XHTML 文档必须拥有根元素。
3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?
用于声明文档使用那种规范（html/Xhtml）一般为 严格 过度 基于框架的html文档
加入XMl声明可触发，解析方式更改为IE5.5 拥有IE5.5的bug
4.行内元素有哪些?块级元素有哪些?
块级元素：div p h1 h2 h3 h4 form ul
行内元素: a b br i span input select
5.HTML全局属性(global attribute)有哪些
参考资料：MDN: html global attribute或者W3C HTML global-attributes
accesskey
:设置快捷键，提供快速访问元素如aaa在windows下的firefox中按alt + shift + a
可激活元素
class
:为元素设置类标识，多个类名用空格分开，CSS和javascript可通过class属性获取元素
contenteditable
: 指定元素内容是否可编辑
contextmenu
: 自定义鼠标右键弹出菜单内容
data-*
: 为元素增加自定义属性
dir
: 设置元素文本方向
draggable
: 设置元素是否可拖拽
dropzone
: 设置元素拖放类型： , move, link
hidden
: 表示一个元素是否与文档。样式上会导致元素不显示，但是不能用这个属性实现样式效果
id
: 元素id，文档内唯一
lang
: 元素内容的的语言
spellcheck
: 是否启动拼写和语法检查
style
: 行内css样式
tabindex
: 设置元素可以获得焦点，通过tab可以导航
title
: 元素相关的建议信息
translate
: 元素和子孙节点内容是否需要本地化
6.什么是web语义化,有什么好处
web语义化是指通过HTML标记表示页面包含的信息，包含了HTML标签的语义化和css命名的语义化。 HTML标签的语义化是指：通过使用包含语义的标签（如h1-h6）恰当地表示文档结构 css命名的语义化是指：为html标签添加有意义的class，id补充未表达的语义，如Microformat通过添加符合规则的class描述信息 为什么需要语义化：
去掉样式后页面呈现清晰的结构
盲人使用读屏器更好地阅读
搜索引擎更好地理解页面，有利于收录
便团队项目的可持续运作及维护
7.html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？
新特性：
HTML5 现在已经不是 SGML 的子集，主要是关于图像，位置，存储，多任务等功能的增加。
拖拽释放(Drag and drop) API
语义化更好的内容标签（header,nav,footer,aside,article,section）
音频、视频API(audio,video)
画布(Canvas) API
地理(Geolocation) API
本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失；
sessionStorage 的数据在浏览器关闭后自动删除
表单控件，calendar、date、time、email、url、search
新的技术webworker, websocket, Geolocation
移除的元素：
纯表现的元素：basefont，big，center，font, s，strike，tt，u；
对可用性产生负面影响的元素：frame，frameset，noframes；
支持HTML5新标签：
IE8/IE7/IE6支持通过 document.createElement 方法产生的标签，可以利用这一特性让这些浏览器支持 HTML5 新标签，浏览器支持新标签后，还需要添加标签默认的样式（当然最好的方式是直接使用成熟的框架、使用最多的是html5shiv框架）：
如何区分：
DOCTYPE声明新增的结构元素、功能元素
8. HTML5 存储类型有什么区别？
HTML5 能够本地存储数据，在之前都是使用 cookies 使用的。HTML5 提供了下面两种本地存储方案：
localStorage - 没有时间限制的数据存储，数据永远不会过期，关闭浏览器也不会丢失
sessionStorage - 针对一个 session 的数据存储，同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。
9. HTML5 标准提供了哪些新的API？
1：canvas，不用多说，可以画出很多绚丽的图形，甚至可以直接做出伪3D游戏。
2：媒体控制，也很好理解(直译就是回放功能，假如只用html5.0以下的标签写，以前的音乐播放是不可能实现滚动条的。)
3：离线网页程序，可以把资源文件完全缓存在客户端，并且通过js的一些方法清空缓存
4：文档编辑，应该是更好的支持对文档的编辑。
5：拖动，可以将文件拖动到某些区域上传
6：跨文档请求，websocket，一种更加高效的通讯方式
7：历史管理，可以通过js管理和插入历史记录
8：MIME头自定义
9：客户端数据存储，localstoage sessionstoage
10：地理位置共享
11：本地数据库
12：索引数据库
10.HTML5 应用程序缓存和浏览器缓存有什么区别？
HTML5 引入了应用程序缓存，这意味着 web 应用可进行缓存，并可在没有因特网连接时进行访问。
应用程序缓存为应用带来三个优势：
离线浏览 - 用户可在应用离线时使用它们
速度 - 已缓存资源加载得更快
减少服务器负载 - 浏览器将只从服务器下载更新过或更改过的资源。
11.常用那几种浏览器测试？有哪些内核(Layout Engine)?
(Q1)浏览器：IE，Chrome，FireFox，Safari，Opera。
(Q2)内核：Trident，Gecko，Presto，Webkit。
12.请描述一下 cookies，sessionStorage 和 localStorage 的区别？
cookie在浏览器和服务器间来回传递。 sessionStorage和localStorage不会
sessionStorage和localStorage的存储空间更大；
sessionStorage和localStorage有更多丰富易用的接口；
sessionStorage和localStorage各自独立的存储空间；
13.如何实现浏览器内多个标签页之间的通信?
调用localstorge、cookies等本地存储方式
14.请写出localStorage对象的常用方法。
存储 - localStorage.setItem(key, value) - 如果key存在，更新value
获取 - localStorage.getItem(key) - 如果key不存在，返回null
删除 - localStorage.removeItem(key) - 删除key对应的数据
全部清除 - localStorage.clear() - 清空localStorage中所有数据
遍历 - localStorage.length
遍历 - localStorage.key(index)
15.如何在HTML5中启用应用程序缓存？
<html manifest="fileName.appcache">
每个指定了manifest的页面在用户对其访问时都会被缓存。
.appcache是manifest文件的扩展名
16.html5 离线存储
Html5的一个重要特性就是离线存储，所谓的离线存储就是将一些资源文件保存在本地，这样后续的页面重新加载将使用本地资源文件，在离线情况下可以继续访问web应用，同时通过一定的手法（更新相关文件或者使用相关API），可以更新、删除离线存储等操作。
Html5的离线存储使用一个manifest文件来标明哪些文件是需要被存储的，使用如 <html manifest='offline.manifest'> 来引入一个manifest文件，这个文件的路径可以是相对的，也可以是绝对的，如果你的web应用很多，而且希望能集中管理manifest文件，那么静态文件服务器是个不错的选择。
17.HTML5 Canvas 元素有什么用？
Canvas 元素用于在网页上绘制图形，该元素标签强大之处在于可以直接在 HTML 上进行图形操作
⑥ 学习web前端都需要会什么软件
有一种软件
dw 代码编辑软件
ftp 上传代码文件到服务器的软件
wampserver 本地模拟服务器的软件
谷歌浏览器或火狐浏览器软件
⑦ 学习web前端开发，需要掌握哪些知识
第一阶段：HTML+CSS/HTML5+CSS3（HTML+CSS、PC端网页重构、HTML5+CSS3）
第二阶段： Javascript（JS数据类型、语法、JS对象、JS内置对象、BOMDOM）
第三阶段：Javascript高级/ Ajax/JQ（AJAX、浏览器缓存、JS对象高级、ES6、JQuery）
第四阶段：前端主流框架（前端工程化、AugularJS、VueJS、React Native、微信小程序）
⑧ 学习WEB前端要多久呀.先从什么方向开始学习哦
您好学习web前端一定要有方向，学习web前端先从核心基础开始学：
阶段1.前端核心基础
HTML +_CSS核心、JavaScript基础语法、JavaScript面向对象、JavaScript DOM和
BOM编程、jQuery框架
阶段2.HTML5 + CSS3 + 移动端核心
HTML5新特性、Canvas专列、CSS3新特性、CSS3进阶、CSS3实例演练
阶段3.移动端
移动端核心、移动端适配、移动端特效
阶段4.服务器端
服务器端开发、数据库操作、前后端交互核心、微信公众号开发
阶段5.JavaScript高级
JavaScript基础深入剖析、JavaScript面向对象深入讲解、JavaScript异步编程、
JavaScript函数式编程JavaScript设计模式
阶段6.前端必备
性能优化、版本控制工具、模块化、项目构建工具
阶段7.高级框架
React框架基本使用、React框架进阶、Vue框架基本使用、Vue框架进阶、Vue源码分析
阶段8.小程序
原生小程序入门、原生小程序API使用、小程序框架Mpvue
web前端学习路线
这个是web前端的学习方向你从上到下按照顺序学习就可以了，一般来说零基础学习前端是5个月左右的时间，学习方法就是做到3多，多问、多思考、多敲 学习的本质就是不断的重复，熟能生巧，希望可以帮到你。
⑨ WebWorker是什么鬼
Web Worker为Web应用程序提供了一种能在后台中运行的方法。通过Web Worker可以生成多个线程同时运行，并保证页面对用户的及时响应，完全不会影响用户的正常操作。
⑩ HTML5 Web Worker是利器还是摆设
Worker能解决两个问题：解决程序阻塞问题：提升效率。不过Worker还有局限性，它不能操作DOM。解决方法如下：
1、首先在创建之前，检测所用浏览器是否支持它，当前除了IE浏览器以外，其它主流浏览器都是支持的。