谷歌浏览器开发者工具有哪些?<超详细!>

 发布时间:2022-04-14  175 来源:谷歌浏览器官网
谷歌浏览器电脑版 谷歌浏览器电脑版

硬件:Windows系统 版本:122.0.6261.6 大小:66.69MB 语言:简体中文 评分: 发布:2023-07-23 更新:2024-05-28 厂商:谷歌信息技术(中国)有限公司

谷歌浏览器安卓版 谷歌浏览器安卓版

硬件:安卓系统 版本:107.0.5304.105 大小:174.16MB 语言:简体中文 评分: 发布:2022-08-18 更新:2024-03-12 厂商:Google Inc.

谷歌浏览器苹果版 谷歌浏览器苹果版

硬件:苹果系统 版本:122.0.6261.89 大小:200.4MB 语言:简体中文 评分: 发布:2022-01-23 更新:2024-03-12 厂商:Google LLC

你认识多少个谷歌的开发者工具,谷歌浏览器作为前端开发者们的首选软件,一直广受好评,从使用人数就能看的出来了,这次小编就带大家认识谷歌浏览器的开发者工具


  1. Performance(旧版浏览器为Timeline):

  时间表可以记录和运行分析应用程序所有的活动,为了使的记录页面的交互,打开时间轴面板,然后按开始录制录制按钮(),或者通过键入键盘快捷键Cmd的 +E(Mac)或按Ctrl +E(Windows / Linux版)。这个记录按钮会从灰色变成红色,而Timeline将开始从你的页面获取时间线(timeline)。在你的应用中完成一些操作,记录到一些数据之后,再一次点击按钮来停止记录。

  红色的点旁边是清除记录。后面的选项可以选择需要capture捕获的项。分别是网络,JS简介,截图,存储,描绘。

  下图是一个任选的一个网页打开的时间表:

1

  第一个框里是概述,这里可以大致看到页面的性能。

  第二个框里是event,即是事件监控。这是CPU的堆栈跟踪的可视化,绿色表示媒体时间,红色表示负载事件,蓝色表示DOM事件。

  第三个框里表示存储

  第四个框里是详细信息,这里会显示事件的详细信息。

  CPU。CPU资源。此区域图指明了事件的类型消耗的CPU资源。

  上图可见加载时间0.02s,脚本15.68s,渲染时间11.28s,绘制时间46.06s,其他时间49.06s,空闲1.27s时间。

2

  上图是总表。下图是详细汇总表。 

 

3

       2. Memory(旧版为Profiles):

  会列出所有的资源,以及HTML5的Database和LocalStore等,你可以对存储的内容编辑和删除 不做过多介绍


  3. Security

  可以告诉你这个网站的安全性,查看有效的证书等


  4. Application(旧版为Resources)

  会列出所有的资源,以及HTML5的Database和LocalStore等,你可以对存储的内容编辑和删除 不做过多介绍


  5. Audits

  可以帮你分析页面性能,有助于优化前端页面,分析后得到的报告


这下你对这些开发者工具都有了简单的认识,更多谷歌浏览器相关知识都在chrome下载站!

相关阅读
手机谷歌浏览器怎么不能翻译网页了

手机谷歌浏览器怎么不能翻译网页了

手机谷歌浏览器怎么不能翻译网页了?下面就让小编给大家带来解决手机谷歌浏览器不能翻译教程一览,感兴趣的朋友快来看看吧。

win10安装谷歌浏览器却上不了网怎么办?<解决方法>

win10安装谷歌浏览器却上不了网怎么办?<解决方法>

Chrome 就是——目前世界上最好的浏览器,没有之一!由于 Chrome 性能强劲、流畅快速、安全稳定、干净无杂质、使用体验佳、免费、跨平台、而且扩展性强。

如何在谷歌浏览器中打开阅读清单

如何在谷歌浏览器中打开阅读清单

如何在谷歌浏览器中打开阅读清单?下面就让小编给大家带来谷歌浏览器打开阅读清单详细教程,有需要的朋友快来看看了解一下吧。

谷歌浏览器怎么更新到最新版本?

谷歌浏览器怎么更新到最新版本?

谷歌浏览器怎么更新到最新版本?谷歌浏览器 Google Chrome完全免费,跨平台支持 Windows、Mac 和 Linux 桌面系统,同时也有 iOS、Android 的手机版 平板版,你几乎可以在任何智能设备上使用到它。

win10系统下载谷歌浏览器打不开怎么办?

win10系统下载谷歌浏览器打不开怎么办?

谷歌浏览器​是一个非常强大的网页浏览器,很多用户都在使用。但是在使用的过程中,相信很多用户都会遇到win10系统中的Google浏览器无法上网的现象,那么该怎么解决呢?

如何下载谷歌 Chrome 67稳定版系统32|64位?

如何下载谷歌 Chrome 67稳定版系统32|64位?

谷歌的Krishna Govind表示:“我们继续在Chrome 67的稳定版本中推广站点隔离功能。站点隔离可以提高Chrome的安全性,减少Spectre漏洞的负面影响。

如何在 Android 上的 Google Chrome 中“预览”网页?

如何在 Android 上的 Google Chrome 中“预览”网页?

本周早些时候推出的 Android 版 Chrome v89 现在允许用户“预览”超链接网页,而不是在新标签页中打开它们。据报道,该功能自 2018 年以来一直在测试中,到目前为止,您可以通过Canary 和 Beta 渠道中的Chrome 标志启用它。

谷歌浏览器怎么设置主页

谷歌浏览器怎么设置主页

你有没有想要知道的谷歌浏览器使用技巧呢呢,你知道谷歌浏览器要怎么设置主页吗?来了解谷歌浏览器设置主页的具体步骤,大家可以学习一下。

Chrome 声音在 Windows 中不起作用是怎么回事?<修复方法>

Chrome 声音在 Windows 中不起作用是怎么回事?<修复方法>

当您什么都听不见时,观看 YouTube 视频的乐趣会少很多。这是在 Windows 上为 Chrome 恢复声音的方法。

谷歌浏览器如何把钟爱的网站变成应用

谷歌浏览器如何把钟爱的网站变成应用

你有没有想要知道的谷歌浏览器使用技巧呢呢,你知道谷歌浏览器如何把钟爱的网站变成应用吗?来了解谷歌浏览器把钟爱的网站变成应用的具体步骤,大家可以学习一下。

谷歌浏览器被篡改主页该怎么办_修改主页的办法

谷歌浏览器被篡改主页该怎么办_修改主页的办法

你有没有在使用谷歌浏览器的时候遇到各种问题呢,你知道谷歌浏览器被篡改是怎么回事呢?来了解谷歌浏览器主页被篡改的解决方法,大家可以学习一下。

如何在 Chrome 中禁用 WebBluetooth 和 WebUSB?

如何在 Chrome 中禁用 WebBluetooth 和 WebUSB?

WebBluetooth 和 WebUSB 是Google Chrome支持的最新 API(应用程序接口)。基本上,这两个 API 都允许网站与连接到运行 Chrome 的系统的设备进行交互。对于许多用户来说,这是一个有用的功能,有时候会导致意想不到的结果。