Computer network

First of all, dear friends, this is Chenxi! A front – end pupil. We also sometimes encounter computer network questions at the front of the interview, so it’s always good to be prepared in order not to be cannibalized by the poor salary. There are two types of network layering models that currently exist:

OSI model: The OSI model is divided into seven layers

The TCP/IP model is similar to the OSI model, but has only four layers

The OSI model

TCP/IP model

TCP/IP model is divided into four layers: Application layer, Host-to-host Transport layer, Internet layer and Network Interface layer.

The application layer

When users use a browser to open a web page, they need to use the domain name resolution service provided by DNS to obtain the IP address corresponding to the url, and then download the page content through another protocol HTTP. The two protocols that emerge from this process (DNS and HTTP) are both protocols that work at the application layer

The transport layer

The transport layer provides data transfer services

The two most important protocols at the transport layer are TCP and UDP. TCP is connection-oriented and UDP is connection-less.

TCP/IP is a transport-layer protocol that deals with how data is transferred over the network, while HTTP is an application-layer protocol that deals with how data is packaged.

The connection between TCP/IP and HTTP is a simple one. “We could just use [transport layer] TCP/IP when we’re transferring data, but then without the application layer, you can’t recognize the content of the data. If you want to make sense of the data being transferred, you have to use application layer protocols, and there are many application layer protocols, like HTTP, FTP, TELNET, etc., You can also define application layer protocols. The WEB uses HTTP as an application-layer protocol to encapsulate HTTP text, and then uses TCP/IP as a transport-layer protocol to send it to the network.”

TCP and UDP

TCP

When a computer wants to communicate with another computer, the communication between the two computers needs to be smooth and reliable, so that data can be sent and received correctly.

For example, if you want to download a file, the downloaded file should be complete, not lack of pictures and words; This is where TCP, which is called Transmission Control Protocol, is one of the main protocols used in TCP/IP networks to ensure that all data is received sequentially, if you don’t use TCP; Data may be lost or out of order, images may not be visible or text may be out of order;

TCP is a connection-oriented protocol. Before two computers communicate, they must establish a TCP logical connection, which is achieved through a three-way handshake. A three-way handshake is A process in which the sender and receiver computers confirm each other, for example: A: Can you hear me? B: Yes, can you hear me? A: Yes. A and B confirm each other once and again before sending and receiving data.

UDP

Similar to TCP, it is used to send and receive data

UDP is connectionless, that is, there is no need to establish communication connections before communication. Nor does it guarantee the reliability of data transmission,

When using UDP to send data, he doesn’t care if the data is received or not, but because of this, his transmission is faster than TCP. It is suitable for real-time applications, such as voice calls and video chats

HTTP and HTTPS

Hypertext Transfer Protocol, which is a way to send our content in plain text, without any encryption; For example, when we visit a website, we may need to enter a password and log in to the website, and then our account will be sent to the server. However, if someone intercepts our information in the middle, some of our important information may be exposed.

Therefore, in order to solve the problem that HTTP is not encrypted, an SSL protocol was added later. This protocol is simply to provide data security and integrity protocol, that is, responsible for the encryption of network connections; For example, if we visit an HTTPS website, our computer will establish a secure connection channel with the server, and then the server will send a certificate information of the website to our computer. It’s like telling our computer, there’s no problem with the server you’re accessing, after confirming the information; Our server will generate a locked box, but the lock has two different keys one for our computer and one for the server itself,

Then the server will send the locked box and key to our computer. We put the information in the box, lock it with the key and then send it to the server. The server will open the box with its own key to ensure the security of the information. Even if messages are intercepted during this process, it is difficult to open without a server key.

HTTP

http0.9

Simple functionality, a single command GET, only supports plain text content

HTTP / 1.0

Only used in some simple web pages and network requests, so relatively simple, any format of content can be sent, which makes the Internet not only can transmit text, but also can transmit images, videos, binary and other files. In addition to GET the order, also introduced the POST command and HEAD Every request to open a new TCP connection, disconnected immediately after received the HTTP request and response of the format change, in addition to the data part, every communication must include the header does not support breakpoint continuingly, that is to say, every time I send all the pages and data. Usually only one IP can be bound per computer using only if-Modified-since and Expires in the header as criteria for cache invalidation.

HTTP / 1.1

The introduction of persistent connections, that is, TCP connections are not closed by default and can be reused by multiple requests. The introduction of pipeline mechanism, that is, in the same TCP connection, the client can send multiple requests at the same time, which further improves the efficiency of HTTP. – Added e-tag, if-unmodified-since, if-match, if-none-match and other cache control headers to control cache invalidation. With virtual networks, multiple virtual hosts can exist on a physical server, and they share the same IP address. Add methods: PUT, PATCH, OPTIONS, and DELETE

The http1.x version is faulty

During data transmission, all data is in plain text. The client and server cannot authenticate each other, thus data security cannot be ensured. HTTP/1.1 allows reuse of TCP connections by default, but in the same TCP connection, all data traffic is sequential, and the server usually processes one response before moving on to the next, which can cause queue headers to block. The HTTP /1.x version supports keep-alive, which compensates for delays in creating multiple connections, but also puts a strain on the server. Moreover, keep-alive can have a significant impact on performance for services where a single file is constantly requested. Because it keeps the connection unnecessarily long after the file is requested.Copy the code

HTTP / 2.0

• New binary format: Binary Frame This is a complete binary protocol, header information and data body are binary, and collectively referred to as “frame” : header information frame and data frame.
• Multiplexing: Multiplexing TCP connections so that both the client and the browser can send multiple requests or responses at the same time in a single connection without having to sequence them one by one. This eliminates queue blocking.
• ** Header compression: ** Header compression HTTP 1.1 version of the field can take hundreds or even thousands of bytes, while the Body is often only a few dozen bytes, resulting in a heavy header. HTTP 2.0 uses the HPACK algorithm for compression.
• Server push: Allows the server to proactively send resources to the client without request.
• ** Request priority: ** You can set the priority of data frames so that the server can handle important resources first to optimize the user experience

The HTTP status code

Indicates the return result of the CLIENT HTTP request, identifies whether the server processes the request properly, and indicates the error of the request.

Class 1 xx information

Received request being processed, information class status code.

HTTP request method

GET method: sends a request to GET some resource on the server.

POST method: submits or appends new data to the resource specified by the URL.

The PUT method: like the POST method, you can submit data to the server, but there are all the differences. PUT specifies the location of the resource on the server, whereas POST does not.

DELETE method: Deletes a resource on the server.

HEAD method: refers to the header of the request page

HTTP contrast HTTPS

TCP

TCP is a connection-oriented, reliable, byte stream – based transport layer protocol

• Connection-oriented; Connection-oriented refers to the connection between the client and the server. TCP requires three handshakes to establish a connection before the two sides communicate with each other, while UDP has no corresponding connection establishment process

• Reliability; TCP reliability is mainly reflected in the fact that 1 is stateful and 2 is controllable

• Byte oriented stream; UDP data transfers are based on datagrams and simply inherit the features of the IP layer, whereas TCP turns IP packets into byte streams for state maintenance

  Have a state; TCP keeps precise records of what data is sent, accepted, and not, and ensures that data arrives in sequence, with no room for error

  Can be controlled; Aware of packet loss or poor network environment, TCP adjusts its behavior to control the sending speed or resending

TCP three-way handshake process

The three-way handshake confirms two abilities of both parties: sending and receiving.

On the first handshake, the client sends a SYN packet to the server and enters the SYN_SENT state, waiting for the server to confirm. SYN is the synchronization sequence number.

The client initiates the connection and sends the SYN. The client becomes syn-sent

On the second handshake, the server receives a SYN packet and must acknowledge the client’s SYN and send a SYN+ACK packet. In this case, the server enters the SYN_RECV state.

When the server receives the SYN, it returns the SYN and ACK (corresponding to the SYN sent by the client), and becomes syn-recD

For the third handshake, the client receives a SYN+ACK packet from the server and sends an ACK packet to the server. After the ACK packet is sent, the client and the server enter the ESTABLISHED state (TCP connection is successful) and complete the three-way handshake.

The client then sends an ACK to the server and changes to ESTABLISHED (ESTABLISHED). The server also changes to this state after receiving the ACK

TCP disconnects with four waves

Disconnecting a TCP connection requires four waves of the hand

First wave

The active closing party sends a FIN and sends data that tells the other party (the passive closing party) that it’s not going to send you any more data. — The party who takes the initiative to close can accept the data.

( )

Second wave

After receiving the FIN packet, the passive close party sends an ACK to the peer party to confirm the sequence number.

(The server notifies the application process and sends ACK confirmation to the client)

Third wave

The passive close side sends a FIN, the close side says, I’m not sending you any more data. (You don’t send data to me, I don’t send data to you either)

(After processing, the server closes the server and sends the FIN and ACK to the client to enter the last-ACK state.)

Fourth wave

The active closing party receives a FIN and sends it to an ACK to confirm the sequence number

(After receiving the FIN from the server, the client sends an ACK to the server. Enter the CLOSED state after waiting 2MSL)

HTTP proxy understanding, can you answer up?

Proxy server functions:

1. Load balancing

2, ensure security (use heartbeat mechanism to monitor the server, once found fault machine will be kicked out of the cluster.) .

3. caching proxy.

Understand proxy caching:

Page storage downloaded by a proxy server;

A proxy server provides a channel for multiple users;

Buffered proxies allow a proxy server to reduce the number of requests to the same page on the same site

Once a user of the proxy server requests a page, the proxy server saves the page to serve the same request from its other users

Proxy caching, which reduces the time users spend waiting for the page to display

Web performance optimization techniques (reduce client network latency and optimize page rendering performance to improve Web performance)

Optimization technology:

• DNS Query Optimization
• Client cache
• Optimizing TCP Connections
• Avoid redirection
• Caching at the network edge
• Conditions of the cache
• Compression and code are extremely simple
• Image optimization

How to optimize website performance

1. In terms of content, reduce Http requests (merge files, CSS sprites, inline Image), reduce DNS queries (DNS caching, distribute resources to the appropriate number of host names), and reduce the number of DOM elements.

2. For cookies, you can reduce the size of cookies.

3. For CSS, place style sheets at the top of the page; Don’t use CSS expressions; Use instead of @import; CSS can be imported from the outside; Compress CSS.

4. In JavaScript, place the script at the bottom of the page; Introducing JavaScript from the outside; Compress JavaScript, remove unwanted scripts, and reduce DOM access.

5. For images, optimize CSS sprites, don’t stretch images in HTML, optimize images (compression)

6. What are the render optimizations? 😝

   First, we can ban the use of iframes

   Second, GIF images can be prohibited to achieve loading effect to reduce CPU consumption and improve rendering performance.

   Third, use CSS3 code instead of JS animation.

   For some small ICONS, you can use base64-bit encoding to reduce network requests. However, you are not recommended to use large ICONS because they consume MORE CPU. The advantage of small ICONS is that they reduce HTTP requests and prevent files from crossing domains.

   The style and script in the page header block the page, and the JS and render threads in the Renderer process are mutually exclusive.

Enter the URL from the browser address bar to display the page

Simply put, the browser sends the requested URL to the DNS for domain name resolution, looks up the real IP address, and sends the request to the server. Server to background processing, return data, browser will receive file data, such as HTML, JS, CSS, images, etc.; Then the browser will parse the loaded resources to establish the corresponding internal data structure; Load the parsed resource file, render the page, complete the display page effect.

So, again, to go into detail, ahem, you get the URL from the browser, you start the network request thread, you make a full HTTP request, you get the request from the server side to the corresponding background side to the corresponding background side, and then the HTTP interaction between the background and the foreground; The cache problem (HTTP cache), browser received HTTP data packet after the parsing process, CSS visual format model, JS engine parsing process; Other rendering page effects.

Browser cache

L The browser cache is divided into strong cache and negotiated cache. When a client requests a resource, the process for obtaining the cache is as follows

² Check whether the resource matches the strong cache based on some HTTP headers. If the resource matches the strong cache, the cache resource will be directly fetched from the local server.

(2) If the strong cache does not match, the client will send a request to the server. The server uses other request headers to verify whether the resource matches the negotiation cache. This is called HTTP reauthentication. When the client receives the return, it retrieves the source from the cache.

(2) Strong caches and negotiated caches have one thing in common: if a cache is hit, the server does not return the resource. The difference is that the strong cache does not send requests to the server, but the negotiated cache does.

² When the negotiation cache also fails, the server sends the resource back to the client.

² When CTRL + F5 forces page refresh, load directly from server, skipping strong cache and negotiation cache.

² When f5 refreshes the page, it skips the strong cache, but checks the negotiated cache.

L strong cache

² Expires This field is the HTTP1.0 specification. The value is a GMT string in absolute time, representing the expiration date of the cache resource

² Cache-control :max-age This field is the http1.1 specification. Strong caching uses its max-age value to determine the maximum lifetime of cached resources, which is in seconds

L Negotiation cache

² Last-Modified is the Last update time of the resource, which is returned with the server response

² if-modified-since Determines whether the resource was Modified between requests by comparing the two times. If not, the negotiated cache is hit

² ETag indicates the unique identifier of the resource content, which is returned with the server response

² if-none-match The server compares if-none-match in the header of the request with the ETag of the current resource to determine whether the resource has been modified between requests. If not, the server matches the negotiation cache

The interview questions

1. Why are the image resources in the webpage placed under different domain names?
2. After establishing a TCP connection with the server, does the browser disconnect after completing an HTTP request? Under what conditions does it disconnect?
3. How many HTTP requests can a TCP connection send simultaneously?
4. How is the concurrency of browser HTTP requests reflected? Is there a limit to the number of concurrent requests?

The last sentence

This is The learning experience of Shen Xi! If there is not straight, also hope to be corrected. I hope you don’t skimp on my advice. See you later.