JS debugging required 5 Debug Tips _javascript Tips

1. Debugger;

As I've said before, you can add a sentence to the JavaScript code debugger; to create a breakpoint effect manually.
Do you want a breakpoint with a condition? You just need to if surround it with statements:

Copy Code code as follows:

if (Somethinghappens) {

Debugger

}

But remember to remove them before the program is released.

2. Set trigger breakpoint when DOM node is changed

Sometimes you will find that DOM is out of your control and there are some strange changes that make it difficult for you to find the root of the problem.

Google Browser's development tool has a super useful function, specifically to deal with this situation, called "Break on ...", you are on the DOM node right, you can see this menu item.

The trigger condition of the breakpoint can be set to the deletion of the node, any changes in the properties of the node, or a change in one of its child nodes.

3. Ajax Breakpoints

XHR breakpoints, or Ajax breakpoints, just like their names, let's set a breakpoint that triggers when the AJAX call of the feature occurs.

This is very effective when you are debugging a Web application's network transfer.

4. Mobile Device Simulation Environment

Google's browser has some very interesting tools for simulating mobile devices to help us debug the operation of the program in the mobile device.

The way to find it is to press F12, pull up the developer tool, and press the ESC key (the current tab cannot be console), and you'll see the second layer of debugging windows appearing with a variety of analog devices available in the Emulation tab.

Of course, this doesn't turn out to be a real iphone, it just simulates the size of the iphone, the touch event, and the browser user agent value.

5. Use audits to improve your site

YSlow is a great tool. Google browser's developer tool also has a very similar tool, called audits.

It can quickly audit your website and give you suggestions and methods that are very practical and effective in optimizing your site.

Is there anything else?

Without these tools, I don't know how to develop. I'll also write more about this--once I find out, keep an eye on my latest article.