探索网页性能的新工具：DevTools Timeline Viewer

DevTools Timeline Viewer 是一个强大的开源工具，它提供了一种全新的方式来共享和查看Chrome DevTools的性能跟踪。这个简洁的Web应用程序支持多种数据源，包括GitHub gist、公共GitHub URL、Dropbox公开链接、Google Drive中的公共文件，以及在授权后访问的私有文件。

技术分析

该应用的核心特性是其离线功能，得益于服务工作者（Service Worker）的支持，即使在网络不稳定或无网络连接的情况下，仍能正常工作。此外，它无缝集成了Google Drive，允许用户直接在Drive中查看和分享性能追踪文件。通过OAuth流程授权，您可以轻松地在权限许可的范围内与他人共享这些URL。

应用场景

对于开发人员来说，DevTools Timeline Viewer 是优化网站性能的理想伴侣。您可以在不同的设备和浏览器上记录性能指标，然后通过生成的可分享URL进行分析。这对于远程协作、问题排查，或者向团队展示性能改进成果尤其有用。同时，由于它可以处理本地文件拖放，您也可以快速检查本地项目的性能。

特点概览

1. 多平台兼容 - 支持从GitHub、Dropbox、Google Drive等多个云存储平台获取性能追踪数据。
2. 离线可用 - 通过Service Worker实现离线访问。
3. Google Drive集成 - 可以作为Google Drive的内置查看器，方便快捷。
4. 安全性 - 用户可以通过个人Google账户授权访问私人文件，确保数据安全。
5. 易于分享 - 分享的URL可以使拥有相应权限的其他用户查看性能追踪，无需他们下载原始文件。

开发与测试

开发过程简单高效，可通过运行 yarn run dev 启动本地服务器，并自动在浏览器中打开应用。此外，项目使用Cypress进行集成测试，确保了应用的质量和稳定性。

如果您正在寻找一种更直观、更便捷的方式来管理您的Chrome DevTools性能数据，那么DevTools Timeline Viewer绝对值得尝试。立即开始探索，提升您的网站性能分析体验吧！

查看项目 | 参与贡献