zoukankan      html  css  js  c++  java
  • Google 的Web开发相关工具

    一、PageSpeed Insights

    PageSpeed Insights 能够针对移动设备和桌面设备生成网页的实际性能报告,并能够提供关于如何改进相应网页的建议。

    在线工具:https://developers.google.cn/speed/pagespeed/insights/

    二、Chrome 开发者工具

    Chrome 开发者工具是一套内置于Google Chrome中的Web开发和调试工具,可用来对网站进行迭代、调试和分析。

    使用文档:https://developers.google.cn/web/tools/chrome-devtools/

    三、使用 Lighthouse 审查网络应用

    Lighthouse 是一个开源的自动化工具,用于改进网络应用的质量。 您可以将其作为一个 Chrome 扩展程序运行,或从命令行运行。 您为 Lighthouse 提供一个您要审查的网址,它将针对此页面运行一连串的测试,然后生成一个有关页面性能的报告。

    使用文档:https://developers.google.cn/web/tools/lighthouse/

    四、Putteteer

    您可以在浏览器中手动执行的大多数操作都可以使用Puppeteer完成!以下是一些可以帮助您入门的示例:

    • 生成页面的屏幕截图和PDF。
    • 抓取SPA并生成预渲染内容(即“SSR”)。
    • 自动化表单提交,UI测试,键盘输入等。
    • 创建最新的自动化测试环境。使用最新的JavaScript和浏览器功能直接在最新版本的Chrome中运行测试。
    • 捕获站点时间线跟踪,以帮助诊断性能问题。
    • 测试Chrome扩展程序。

    使用文档:https://developers.google.cn/web/tools/puppeteer/

    五、Workbox

    JavaScript库,用于为Web应用程序添加离线支持,Workbox是一组库和节点模块,可以轻松缓存资产并充分利用用于构建Progressive Web Apps的功能

    为何选择Workbox?

    Workbox是一个库,它结合了一组最佳实践,并删除了每个开发人员在与服务工作者一起工作时编写的样板文件

    • 预缓存
    • 运行时缓存
    • 策略
    • 请求路由
    • 背景同步
    • 有用的调试
    • 比sw-precache和sw-toolbox具有更大的灵活性和功能集

    使用文档:https://developers.google.cn/web/tools/workbox/

  • 相关阅读:
    UICollectionView
    UIDynamicPPT
    05-UIDynamic
    键盘处理return key-工具条
    源代码管理工具 git
    源代码管理工具
    核心动画09-CATransition转场动画
    核心动画06-时钟(了解)
    Intersect,Minus,union all 和union的区别
    freemarker大于,小于 gt,lt 的用法
  • 原文地址:https://www.cnblogs.com/heroljy/p/9758672.html
Copyright © 2011-2022 走看看