console.log/warn/error - 原生的、普通的 JavaScript 性能更高的替代方案?

console.log/warn/error - native, vanilla JavaScript more performant alternative?

提问人:willstocks_ 提问时间:2/6/2019 更新时间:2/6/2019 访问量:200

问:

我做了一些研究,我发现的大部分都是几年前的。我是JS的新手,我正在逐渐积累我的知识。

Console.log() 是一个非常有用的工具,但我非常警惕它通常很差的性能(https://jsperf.com/console-log1337/16https://jsperf.com/console-log1337/33 作为基本示例),以及糟糕的声誉。

如果我需要在生产应用程序/网站中留下 console.log() 样式的错误消息,是否有原版JS原生的性能更高的替代方案(没有框架/库)?

我最初的想法是将所有日志项推送到一个数组中,稍后可以收集该数组(如果需要),但是似乎不能很好地与 Promise.all() 结合使用 - 而不是说,数组中有 10 个项目,而是返回一个带有最后一个值的数组,或者 10 个单独的数组。

是否有原生的或最推荐的替代方案(欣赏这是对“意见”开放的 - 我不确定还能如何措辞!

Ps - 为缺乏格式而道歉......移动!

JavaScript 性能 Firebug 控制台 .log

评论

2赞 IrkenInvader 2/6/2019
console.log 调用不会减慢您的网站速度,除非它们被调用的频率非常高。一个聪明的编程方法是,在你需要之前,永远不要担心性能。如果你总是担心每个命令的微观性能,你就会陷入细节的泥潭,扼杀你的生产力。
0赞 IrkenInvader 2/6/2019
为了解决您的特定问题 - 您可以查看像 google analytics 这样的指标收集服务并将相关数据发送到该服务,这应该比控制台日志更有用,因为控制台日志需要您手动检查用户报告的每个问题。
0赞 epascarello 2/6/2019
Promise All,听起来像是你用错了或误解了异步调用。
0赞 willstocks_ 2/6/2019
@irkeninvader - 多频繁才算太频繁?我们是在谈论每秒 100 秒还是更多?我不会将它们附加到滚动事件(就像某些事件一样)。我并没有对我拥有的少数几个大惊小怪(调试时可能有 30 个左右,而且并非所有它们都能运行),这有助于我进行函数的逐步测试和重构。回复:微观优化,我完全同意。我不是把这些作为“问题”来关注,而是作为一个学习点。我知道那里有很多框架的东西,但理想情况下,我想先清理原生 JS :)
0赞 willstocks_ 2/6/2019
@epascarello - 可能是这样,老实说,我仍在学习“基础知识”。我目前更倾向于 .then()'ing 我拥有的一些 Promise.all(),因为我认为这将是一个更合适的工作流程 - 但这是题外话!老实说,我不认为将消息存储在数组中有多大用处?

答:

3赞 Jonas Wilms 2/6/2019 #1

...性能不佳

其中一个测试用例将调用空函数与调用 进行了比较。JIT 编译器可能会内联一个空函数,因此您实际上根本没有将任何代码与 进行比较。可以肯定的是,根本没有代码会更快。console.logconsole.log

由于日志记录,我从未遇到过任何(明显的)延迟,除非您在渲染循环中记录或非常非常频繁地执行的任何内容。

...名声不好

认真地?在我看来,与其他语言相比,JS 有很好的调试方式(可能是因为 JS :)有最好的错误),因为你可以“实时”查看嵌套结构,你可以在断点处停止执行,你可以准备代码进行调试与语句,你可以转储整个内存,可视化 GC 行为、热函数等等。是的,所有这些功能的性能都较低,但是控制台的性能相当不错。debugger;

有没有 vanilla JS 原生的性能更高的替代方案(没有框架/库)?

The logging is directly written into the engine executing JavaScript, that means it can access a lot of things that you cannot access through JS, also native code will always be faster than compiled JavaScript (or equally fast, but no one can guarantee that).

In the event I need to leave console.log() style error messages in a production application/website ...

And who should read this logs? Do you want to ask your client to look into the console in the case of an error?

Logging in Production should not log everything you use through debugging, but just enough that you can track down errors, so some breadcrumbs to find out where the error occured (e.g. "menu open"), and the errors themselves.

If you don't want to write production logging by yourself, have a look at sentry for JS

评论

0赞 Code Maniac 2/6/2019
The logging is directly written into the engine executing JavaScript, that means it can access a lot of things that you cannot access through JS, also native code will always be faster than compiled JavaScript. +1 for this line
0赞 willstocks_ 2/6/2019
Thanks Jonas - this is actually incredibly helpful/insightful! :) I tried to research this (based on a conversation I had) however every example case I found always compared console.log to an empty function, which I did think was strange because an empty function isn’t doing anything! Re: the “bad rep” - I was referring specifically to console.log. It seems to have a really bad name, almost hated based on everything I’ve seen/heard lately (almost as bad as eval!). Re: access to the logs - it’s not writing anything “sensitive” per se, so is open to clients/end users for troubleshooting/diag.
0赞 willstocks_ 2/6/2019
By the sounds of it, sticking with a few console.logs isn’t going to be a bad thing! I’m not attaching them to scroll events or anything like that - I have a version purely for debugging/step-by-step indicators, and a version with 90% of console.log stripped out.
0赞 Jonas Wilms 2/6/2019
@willstocks_tech well clients shouldn't have access to sensitive data at all ... I mean it is just a bad user experience, looking at the console is the developer's not the user's job. "I've heard lately" ... who said that?
0赞 willstocks_ 2/6/2019
@jonas-wilms no, they don’t and I wouldn’t allow it. It was more for surface level debugging on their end. To make it a bit easier to “troubleshoot” themselves (or to provide me with the info a bit easier - lol!) as the end client are fairly savvy in themselves and might be able to work out they’re passing something in the wrong format etc.. “I’ve heard lately” - mainly conversations around the workplace and with third party devs (although they’re a bit old school... so might be a personality type thing!!!). There were a few posts I came across on SO as well!