Chrome 调试工具的一些高阶功能
Chrome 内置抓包工具
Block requests
截取长图
代码的覆盖率分析
Make site better
Chrome 内置抓包工具
在浏览器地址栏输入chrome://net-internals/#events，即可打开自带的抓包工具。工具处于live状态，其他tab 页有请求刷新，列表会随之刷新请求的快照，点击快照可查看详细的请求信息，配合 network面板能看到一个完整的请求。
Block requests
network 面板右击请求即可看到 block 选项，这个选项能够使我们在请求和域的级别上打断点。
eg: 配合 Preserve log 可以监测请求在不同域之间转发跳转时状态变化(请求在不同域之间转发跳转，network面板会经常性地丢失 response)。
截取长图
切换 device 到其他模式(比如调试移动端)时，右边菜单栏提供了 capture full-page screenshots的选项。
eg: 配合这个选项可以做一些 module lazyload 的优化。
代码的覆盖率分析
通过coverage 面板可以找到没有用到的 css和 js 代码，点击单个文件可以查看详情，并且也是处于 live 状态，页面发生变化时，覆盖率报告也会随之刷新。通过右边菜单 more tools 或者通过快捷键 ctrl + shift +p (windows) 输入coverage 即可打开 coverage。
Make site better
Audits panel 提供了 PWA, performance, 无障碍，最佳实践四个维度的网站测试报告。提供了不是很常见的无障碍测试，配合报告我们可以进行更好的无障碍优化。
在每次发布版本时，Chrome Devtools Updates 会提示更新的内容。当然，最简单的方法就是保持chrome的版本更新，更新后 devtool 面板会自动推送 features && changes
最新文章
- php 用 http post方法传输数据
- JS：offsetWidth\offsetleft 等图文解释
- 【翻译】C# Tips & Tricks: Weak References - When and How to Use Them
- Android 杂记 - 存货盘点用的客户端
- oracle 常用语句
- 学习W3SCHOOL 表单验证
- NetBeans自定义代码折叠块，类似vs中的#region
- ASP.NET怎么防止多次点击提交按钮重复提交
- VS2012JSON自动生成对应的类
- Unity人工智能学习—确定性AI算法之追踪算法二
- LeetCode -- Word Break 动态规划，详细理解
- 笔记：Jersey REST 传输格式-JSON
- Cisco 的基本配置实例之五----交换机的路由功能与DHCP 功能
- 怎么样通过php使用html5实现多文件上传？（php多图上传）
- jmeter接口测试实例6-注册（参数化）
- scp: command not found
- aarch64_a1
- Java遇到的问题、错误——持续更新
- 《Drools7.0.0.Final规则引擎教程》第4章 4.2 auto-focus
- FCL研究-LINQ-System.Linq Enumerable