V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
surunzi
V2EX  ›  JavaScript

Eruda 3.0 发布:移动端调试工具

  •  3
     
  •   surunzi · 169 天前 · 1285 次点击
    这是一个创建于 169 天前的主题,其中的信息可能已经有所发展或是发生改变。

    Eruda 移动端调试工具距 2.0.0 版本发布已经过了三年的时间,其中在 2.4.1 版本发布后有接近两年的时间因工作生活繁忙暂停了更新,直到去年下半年才重新投入精力开发,最近终于成功发布了 3.0 版本。从 2.0 到 3.0 版本,主要做了以下一些更新。

    截图

    内部组件抽离

    为更好地开发和复用组件,Eruda 中绝大部分可复用组件均已抽离至 Luna UI 组件库中进行更新维护,这其中就包括了完整的 console 实现、DOM 树展示高亮等。这些组件不依赖特定的前端框架,可以直接引入使用。比如前段时间写过的一个 vscode 配置可视化插件,就是跟 eruda 引用了相同的设置面板组件。

    桌面端适配

    Eruda 一直都是针对移动端进行功能设计的,在 PC 场景上都是推荐使用浏览器自带的调试工具。后面发现在桌面浏览器其实也会有人使用该工具,主要是一些在线写代码的工具,比如 replitSolid Playground。因此,新版本针对 PC 端做了适当优化,包括移除横向滚动条,鼠标替代触摸操作以及大屏下 Elements 和 Network 面板进行分屏展示等。当然,如果你不考虑浏览器兼容性,仅支持 Chromium 系浏览器,推荐使用 Chii,它可以让你直接使用 Chrome 的调试器,更符合桌面端的使用习惯,点此可以查看示例效果。

    DOM 插件内置

    旧版本的 Elements 面板考虑到移动端操作不便,并不提供 DOM 树的展示功能,相关功能抽离成插件形式进行提供。鉴于 DOM 插件引入的频率较高,新版本将其进行内置,同时做了一些更新,比如节点自动更新,无需对节点进行重新展开来刷新子树。此外,console 面板也可以直接打印出可交互的 DOM 树结构。

    功能更新

    除了上边说的几项,新版本对各个面板功能都进行了一定的优化。比如反馈最多的复制功能,所有面板都在合适的地方添加一键复制的按钮,console 面板可以复制日志,elements 面板可以复制节点,network 面板可以复制为 cURL 等。插件部分也进行了必要的更新,原有的 fps 和 memory 插件合并成为一个新的 monitor 插件。具体其它更新细节可以在每个版本的更新日志中查看。

    体积优化

    新版本在增加了功能的同时,体积相对于 2.0.0 版本( 452 KB )基本不变( 441 KB ),gzip 后仅 118 KB 。除了将占用体积巨大,性价比较低的代码格式化库移除外,Eruda 目前仅引用一个 Licia JS 工具库和 Luna UI 组件库,严格控制第三方库的引入,使体积保持在可接受的范围内。

    不知不觉,自 2016 年初发布第一个版本后已经过了 7 年的时光,未来会继续更新维护,欢迎大家使用。

    PS:如果有问题或建议,可以到仓库 issue 页进行反馈:)

    6 条回复    2023-04-06 10:01:45 +08:00
    lopssh
        1
    lopssh  
       169 天前 via Android
    支持一次。
    debuggerx
        2
    debuggerx  
       169 天前
    感谢大佬,之前写 SB 的微信项目时用过,简直是救命神器
    iulo
        3
    iulo  
       169 天前
    很棒的库
    Parva
        4
    Parva  
       169 天前
    你们还用 hybrid 开发移动端 app 嘛?
    HiCode
        5
    HiCode  
       168 天前
    用了好多年,默默点赞!!!
    soya2
        6
    soya2  
       168 天前
    狠狠的点赞,在移动端和微信下太有用了
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   我们的愿景   ·   实用小工具   ·   3012 人在线   最高记录 5930   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 28ms · UTC 12:33 · PVG 20:33 · LAX 05:33 · JFK 08:33
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.