发表于: 2021-01-28 23:41:45

1 1002


今天完成的事情:

1-Network面板

概述

Network面板可以记录页面上的网络请求的详情信息,从发起网页页面请求Request后分析HTTP请求后得到的各个请求资源信息(包括状态、资源类型、大小、所用时间、Request和Response等),可以根据这个进行网络性能优化。

该面板主要包括5大块窗格(Pane):

Controls 控制Network的外观和功能。

Filters 控制Requests Table具体显示哪些内容。

Overview 显示获取到资源的时间轴信息。

Requests Table 按资源获取的前后顺序显示所有获取到的资源信息,点击资源名可以查看该资源的详细信息。

Summary 显示总的请求数、数据传输量、加载时间信息。

其中 Requests Table 显示如下信息列:

Name 资源名称,点击名称可以查看资源的详情情况,包括Headers、Preview、Response、Cookies、Timing。

Status HTTP状态码。

Type 请求的资源MIME类型。

Initiator 标记请求是由哪个对象或进程发起的(请求源)。

Parser: 请求由Chrome的HTML解析器时发起的。

Redirect:请求是由HTTP页面重定向发起的。

Script:请求是由Script脚本发起的。

Other:请求是由其他进程发起的,比如用户点击一个链接跳转到另一个页面或者在地址栏输入URL地址。

Size 从服务器下载的文件和请求的资源大小。如果是从缓存中取得的资源则该列会显示(from cache)

Time 请求或下载的时间,从发起Request到获取到Response所用的总时间。

Timeline 显示所有网络请求的可视化瀑布流(时间状态轴),点击时间轴,可以查看该请求的详细信息,点击列头则可以根据指定的字段可以排序。


headers中的每一项意义:

General部分: 

Request URL:资源的请求url

Request Method:HTTP方法

Status Code:响应状态码

200(状态码) OK(原因短语)

301 - 资源(网页等)被永久转移到其它URL

404 - 请求的资源(网页等)不存在

500 - 内部服务器错误


Response Headers:

Content-Encoding:gzip ——压缩编码类型

Content-Type:text/html ——服务端发送的类型及采用的编码方式

Date:Tue, 14 Feb 2017 03:38:28 GMT ——客户端请求服务端的时间

Last-Modified:Fri, 10 Feb 2017 09:46:23 GMT ——服务端对该资源最后修改的时间,GMT是格林尼治标准时间

Server:nginx/1.2.4 ——服务端的Web服务端名

Transfer-Encoding:chunked ——分块传递数据到客户端


Request Headers:

Accept:text/html ——客户端能接收的资源类型

Accept-Encoding:gzip, deflate ——客户端能接收的压缩数据的类型

Accept-Language:en-US,en;q=0.8 ——客户端接收的语言类型

Cache-Control:no-cache ——服务端禁止客户端缓存页面数据

Connection:keep-alive ——维护客户端和服务端的连接关系

Cookie: ——客户端暂存服务端的信息

Host:www.jnshu.com ——连接的目标主机和端口号

Pragma:no-cache ——服务端禁止客户端缓存页面数据

Referer:http://www.jnshu.com/daily/15052 ——来于哪里

User-Agent: ——客户端版本号的名字


2-HTTP状态码

当浏览者访问一个网页时,浏览者的浏览器会向网页所在服务器发出请求。当浏览器接收并显示网页前,此网页所在的服务器会返回一个包含HTTP状态码的信息头(server header)用以响应浏览器的请求

例如:刚接触网络时,经常重现搜索网页出现“404”,这个404就是状态码

状态码分类:

1** 信息,服务器收到请求,需要请求者继续执行操作

2** 成功,操作被成功接收并处理

3** 重定向,需要进一步的操作以完成请求

4** 客户端错误,请求包含语法错误或无法完成请求

5** 服务器错误,服务器在处理请求的过程中发生了错误


常见的HTTP状态码:

200 - 请求成功

301 - 资源(网页等)被永久转移到其它URL

404 - 请求的资源(网页等)不存在

500 - 内部服务器错误


3-简述原型链是什么,有什么用处?若想访问一个对象的原型,应该使用什么方法

原型链

当访问一个对象的某个属性时,会先在这个对象本身属性上查找,如果没有找到,则会去它的proto隐式原型上查找,即它的构造函数的prototype,如果还没有找到就会再在构造函数的prototype的proto中查找,这样一层一层向上查找就会形成一个链式结构,我们称为原型链。

            function Parent(month) {
                this.month = month;
            }
            var child = new Parent('Ann');
            console.log(child.month); // Ann
            console.log(child.father); // undefined


访问一个对象的原型的方法:

1. obj.proto

2. obj.constructor.prototype

3. Object.getPrototypeOf(obj)



问题:

有什么详细的angular资料看吗


返回列表 返回列表
评论

    分享到