首页
学习
活动
专区
工具
TVP
发布

调试JS代码

记录下近期对JS代码调试过程 性能分析 启动程序之后,打开google浏览器对应页面,按F12或者Ctrl+Shift+I进入 开发者工具页面 目前主要使用的功能有: Performance....性能评估,比如我想看下页面刷新的性能瓶颈所在,先点击 按钮,然后进行页面操作,当页面刷新完成,再点击 按钮,则会生成性能报告,可以看到资源消耗,JS代码的执行逻辑等 Sources....性能报告页面的 部分,可以通过点击色块查看其所在的js代码文件,如 点击则会跳转到 功能栏,有了源文件就可以进行断点调试;这里注意部分js文件是压缩后的文件,建议手动修改程序替换成可读性更强的原始代码文件...,方便调试 Console....查看程序的打印输出,比如我想知道某个函数的执行时间,可以在js代码中进行修改 当js代码执行之后,可以在console输出中看到foo的执行时间 Network.

19K10

Chrome - JavaScript调试技巧总结(浏览器调试JS

Chrome 是 Google 出品的一款非常优秀的浏览器,其内置了开发者工具(Windows 系统中按下 F12 即可开启),可以让我们方便地对 JavaScript 代码进行调试。...(2)刷新浏览器,当页面代码运行到断点处便会暂停执行。 ? 方法2:在 js 文件中设置 (1)我们在 js 源文件中需要执行断点操作的代码前加上 debugger。...(2)刷新浏览器,当页面代码运行到断点处会暂停执行 ?...有了条件断点,我们在调试代码的时候能够更加精确地控制代码断点的时机 ?...七、格式化 1,js代码格式化 为了减小体积,有时候我们发现一些 js 源码都是压缩之后的代码,我们可以点击下面的 {} 大括号按钮将代码转成可读格式。 ?

23K43
您找到你想要的搜索结果了吗?
是的
没有找到

加密JS代码调试

JavaScript奇技淫巧:加密JS代码调试 JS代码混淆加密,已被很多人使用,因为它真的很有用、很实用,可以用于保护代码、防护分析、复制、盗用,还可以用于小游戏过审、APP加固等方面。...混淆加密后的JS代码,可能被他人分析,为了对抗分析调试,本文分享一种反调试技术。 功能效果 使函数名不可修改,修改则代码无法运行 技术原理 将JS代码用可逆算法进行加密。...在分析调试时,分析者经常会将无意义的函数名改成有含义的名字,使便于理解。 本文我们要做的,就是禁止改名,如果修改函数名,函数就无法执行。...之前的代码,改造为以下形式: 运行: 输出结果与修改代码前相同。 这段代码的含意是:解密、并用eval执行。这就达到了跟原始代码一样的功能效果。...Date().getFullYear() + "," + _0xbc99c; console.log(_0x7d68de); ` function _0xag(){ var decode_js_code

5.5K50

爬虫|如何在Pycharm中调试JS代码

环境配置 Pycharm 专业版 Node.js 在爬虫遇到 JS 加密的时候,通用做法是对 JS 代码进行调试分析加密流程及方法 最终调试完需要将相关代码拿到本地,因为最终是在本地环境执行。...这时候可能又会遇到各种参数未定义等报错 所以还需要在本地对 JS 进行调试,查漏补缺。那么我们是不是需要安装 Node.js,同时需要安装编辑器 WebStorm,大部分的做法都是这样。...安装完之后重启,在 Plugins 插件界面会显示刚才安装的插件 验证 下面我们新建一个简单的 JS 文件来验证一下是否可正常运行 在运行下拉按钮 ,点击 Edit Configuratuions, 然后选择...可以看到有 Node.js 选项,选择 Node.js,同时在 Node interpreter 选择 NodeJS 的安装路径,记得先加入环境变量 OK,完成上述步骤后,就能在 Pycharm 中完美运行...JS 代码了 ?

2.8K20

【Node.js】如何调试你的 Node.js 代码

很多时候,我苦恼于 Node.js调试,只会使用 console.log 这种带有侵入性的方法,但是其实 Node.js 也可以做到跟浏览器调试一样的方便。...Vscode 调试 除了浏览器之外,各大主流的 IDE 都支持 Node.js调试,本文以 Vscode 为例。...command + shift + p(window Ctrl+Shift+p),输入 Attach to Node Process Action,回车,然后选中运行中进程再回车,就可以跟上面配置一样调试代码了...总结 本文总结了两种常见的调试 Node.js 的方式。第一种 Node.js 通过 websocket 的方式将信息传递给 Chrome 浏览器,我们直接在 Chrome 中进行调试。...通过 Attach to Node Process Action 的方式,可以便捷的调试正在运行的 Node.js 代码,而不需要配置。

8.2K10

别只用 console.log() 调试 js 代码

JavaScript中的 console 对象可用于访问浏览器调试控制台,可以用它在控制台中输出代码中变量的值。 不过大多数人都只过 console.log() 在浏览器控制台中进行输出调试。...2. console.error() 这个方法在测试代码时非常有用。它用于将错误输出到浏览器控制台。错误消息默认用红色突出显示。...每当我们想知道一个代码块或函数所花费的时间时,都可以用 time() 和 timeEnd() 方法。这两个函数都以字符串作为参数。使用时要对这两个函数用相同的字符串来测量时间。...总结 console 对象对代码调试非常有用。但是很多人通常只用 log 函数。从现在开始应该充分利用 console 对象,以便更轻松地调试并生动地查看浏览器日志。

1.3K30

分享高效使用 Chrome 浏览器调试前端代码的技巧

前言 相信大部分前端同学都是用 Chrome 浏览器进行开发,这篇博客要分享的基本上是除了我们常用 console.log之外的,Chrome 开发者工具控制面板提供的调试方法~ 首先在地址栏敲入:about...利用此方法可以快速在 Console 面板调试你选中的节点! ?....*\})/, replacer); console.log(str); // abc - 12345 - #$*% - [hello] - {world}复制代码 $ 类似于 document.querySelector...关于断点调试 断点调试十分重要,以往我们可能直接在代码里添加 debugger,然后刷新浏览器调试。实际上除了这种方法外还有很多种断点。...小结 其实长久以来,我也一直只会用 console.log 和简单的 debugger 来调试 Web 应用,有时候遇到复杂的问题时,匮乏的调试方法种类难以快速定位问题,从而降低工作效率。

1.1K30

Node.js源码学习——搭建阅读调试代码环境

搭建阅读/调试环境 阅读BUILDING.md,编译Debug版的Node执行文件 选择JS/C++的IDE,笔者选择CLion(C++),WebStorm(JS) 配置调试参数 3....CLion调试C++ 在*unix下,Node.js是用make来构建的,但是CLion是使用CMake来构建调试C++的,CLion可以根据代码目录自动生成CMakeLists.txt,以供调试; 在.../demo.js,--inpect-brk是在应用代码的第一行断开;这里配置对应的命令行就是node --inspect-brk /User/run/project/node_source_learn/...WebStorm调试JS(官网介绍) 在WebStorm里,新建一个目录,新建demo.js,用来调试JS代码; 这里在Edit Configurations,选择Attach to Node.js/Chrome...调试时,把CLion和WebStorm都启动调试 C++断点: [C++调试截图] JS断点: [JS调试截图] 至此,Node.js的C++/JS混合阅读调试环境搭建完毕;

2.8K90

浏览器调试小技巧

选择DOM元素 将浏览器转换为编辑器 你有多少次想知道你是否可以在浏览器中编辑一些文本? 答案是肯定的,你可以将浏览器转换为文本编辑器。 你可以在 DOM 中的任何位置添加文本和从中删除文本。...查找与DOM中的元素关联的事件 调试时,需要查找 DOM 中某个元素的事件侦听器感时,谷歌控制台用了 getEventListeners使找到这些事件更加容易且直观。...As the last Result was 81 $_ 9 // As the Last Result is 9 清除控制台和内存 如果你想清除控制台及其内存,输入如下: clear() 推荐 代码部署后可能存在的...BUG没法实时知道,事后为了解决这些BUG,花了大量的时间进行log 调试,这边顺便给大家推荐一个好用的BUG监控工具 Fundebug。

1.5K10

Fiddler远程调试js

使用Fiddler调试本地js   在我们前端开发的日常工作中,发现服务器上某个css/javascript文件有问题,需要修改,那真是家常便饭。...刷新一下浏览器页面,看一下session列表,如果像下面这样,这个session的底色是灰色的,那么恭喜你,你已经成功将这个请求重定向到本地文件了! ?...第五步:修改本地文件,进行测试   我们在本地的js文件中加一句alert(‘hello’) ? 刷新浏览器,看看效果,如果alert出来,那就成功了。   ...通过以上几个步骤,我们演示了怎样将HTTP请求重定向到本地的文件,进行web调试。...这种调试方式不需要发布到线上再验证,避免了修改不成功、对用户造成影响的风险,而且不需要搭建复杂的开发服务器等开发环境,非常适合快速web调试

9.9K30
领券