[html] 常见的浏览器内核都有哪些?并介绍下你对内核的理解
[css] 说说你对css盒子模型的理解
[js] 写一个获取当前url查询字符串中的参数的方法
[软技能] 网页应用从服务器主动推送到客户端有那些方式?
题目来源:
作者:浪子神剑
链接:https://www.jianshu.com/p/baecd5ea9fd9
一、常见浏览器内核,简要理解
Trident内核:IE使用的内核
Blink/Chromuium内核:新一代的chrome内核
Webkit内核:常被称为chrome内核,但其实chorm内核早就改用Blink
Gecko内核:开源,常被称为FireFox内核
Prosto内核:Opera以前使用的内核。
就是浏览器的渲染引擎和js引擎,一个好的内核在渲染速度以及优化上都能更好的增加浏览器的用户体验
二、CSS盒子模型
有标准盒子模型和IE盒子模型两种(不知道在哪弄的这两张图)
标准盒子模型:元素宽高等于content区域的宽高
IE盒子模型:元素的宽高等于border+padding+content区域的宽高
三、获取当前url查询字符串中参数
window.location可获得当前路径的所有信息
function params() {
const search = window.location.search
search = search.substr(1)
const res = {}
if (!search) return res
search.split('&').map(item => {
const [key, value] = item.split('=')
res[key] = decodeURIComponent(value)
})
console.log(res)
}
四、网页应用从服务器推送到客户端的方式
webSocket
WebSocket 是一种在单个 TCP 连接上进行全双工通信的协议
WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。
eventsource(SSE)
EventSource 接口是 Web 内容与服务器发送的事件的接口。一个 EventSource 实例打开一个持久连接 HTTP 服务器,它发送事件的 text/event-stream 格式。连接保持打开状态,直到通过调用关闭 EventSource.close()。
与 WebSockets 不同,服务器发送的事件是单向的。也就是说,数据消息是从服务器到客户端(例如用户的 Web 浏览器)沿一个方向传递的
Web Push
就是用户订阅了一个站点的 Web Push 服务后,即使用户关闭了浏览器,一旦站点主动发送推送消息,用户都能收到,只要你的电脑是开着的。这是目前谷歌和苹果在 Chrome 和 Safari 上都力推的一种全新推送服务,Firefox 最近也加入了这个阵营。
但是由于需要 GCM 支持,所以这个方法并不常见