Topic Overview
- Common browser core has what? Your understanding of the kernel and introduced under
- Talk about your understanding of the box model css
- Which have built-in JS objects under a brief description
- Real-time push technology news Web ways in which
Subject to answer
Common browser core has what? Your understanding of the kernel and introduced under
- The concept: the kernel is divided into JS rendering engine and engine. The former is responsible for rendering the page, which is responsible for implementation of parsing JavaScript.
After that, more and more independent because the JS engine, now called the browser kernel mostly refers to the rendering engine
- Trident: developed by Microsoft, that is well known in the IE core
- Gecko: developed using C ++ rendering engine, including SpiderMonkey that is familiar FireFox
- Presto: Opera kernel used
- Webkit: front-end using up Chrome and Safari use the kernel
Talk about your understanding of the box model css
- css box model consists of two boxes composed, whether external control box wrap, as well as internal control element content of the box. For example: display: inline-block, it is inline external box is not occupied by a line, while the interior of the block, said element having a bulk properties. So, display: inline in fact display: inline-inline abbreviation of, display: block is the display: block-block of abbreviation.
- Each box has an intrinsic: width / height, padding, border, margin control these attributes box size. Wherein the width / height control element content size, padding to the contents of the control element from the inside border line, the border element is a peripheral border size, and the margin is to control the spacing of the other elements, it is clear background.
- For early calculates an element occupying the size needs to be calculated by the width + 2 * padding + 2 * border, css3 proposes a box-sizing: border-box, By doing so, it allows elements to the final width and height is provided given width / height, based on the browser width / height, padding, size border to automatically adjust the size of the inner element.
Write a get current url query string parameter of the method
//方式一：split
function urlParam() {
const search = window.location.search;
search = search.substr(1, search.length);
const res = {};
if (!search) return res;
search.split('&').map(item => {
const [key, value] = item.split('=');
res[key] = decodeURIComponent(value);
});
return res;
}
//方式二：正则
function urlParam(){
const param = {};
location.search.replace(/([^&=?]+)=([^&]+)/g,(m,$1,$2)=> param[$1] = $2);
return param;
}
Real-time push technology news Web ways in which
| Poll (polling) |
client→server |
The client requests circulation |
1. 2. support simple cross-domain |
1. 2. wasting bandwidth and server resources are useless most of the time request information (complete http header information) 3. 4. Most of invalid requests delay |
Suitable for small applications |
| Long polling (long-polling) |
client→server |
Hold live connection server, or until a timeout before returning the data, reducing the number of repeat request |
2. 1. simple not frequently save traffic transmission request 3. 4. low delay |
1. Server hold live connection consumes resources 2. The first half is useless information request |
WebQQ, Hi web version, Facebook IM |
| iframe stream |
client→server |
Embedding a hidden Zao iframe in the page, this iframe src attribute set to a long connection request, the server can be a steady stream of input data to the client. |
1. 2. Real-time data delivery is not made useless requests, a link, many times "push" |
1. Server 2. The cost increase can not be accurately know the connection status 3.IE, Chrome, etc. would have been in a loading state |
Gmail Chat |
| WebSocket |
client⇌server |
new WebSocket() |
1. support bidirectional communication, real-time capability can send binary files 2. 3. Reducing traffic |
1. 2. browser does not support the level of support is inconsistent to disconnect and reconnect |
Online games, interactive banking and payments |