“This article has participated in the good article call order activity, click to see: back end, big front end double track submission, 20,000 yuan prize pool for you to challenge!”

preface

Bits and pieces It has been more than three years since I started writing code, and I was told that I could get a good job when I graduated from college by writing 100,000 lines of code. I don’t know if I would be hired by a big factory if I wrote more than 100,000 lines of BUG. Willing to write bug benefits is also began to sum up some experience to find bugs to share with you

Find BUG # 1

The first way to find a BUG is to identify the cause of the BUG. The first way is to locate the BUG roughly throughout the loading process of the page. This method is to find your BUG in the most intuitive place.

Press F12 in the browser to bring up developer mode, then select Slow 3G from the Network drop-down, so that the entire page loading speed is limited by the Network speed, not only to test how your page will load in a poor Network environment, You can also see which render state your page is in when the error is reported.

Find BUG 2

The second method for the file in the JS error, we must pay attention to this error, before the online can not leave a JS error (painful experience)

This is a very simple error, write the code in the past, I have a very bad habit, is any error, will be directly laid hands on him is copied to the baidu, then click on baidu, think of all the problems will be solved, in a very many people have met problems, it is a very good solution, but since I work into the factory, It turns out that each factory has many of its own frameworks and languages, and the reported error is not on the network at all, and you have no way to solve the problem. So we should start by looking at the error, the first step is to read the English of the error and then the at at at the bottom is followed by the line in which file you are reporting the error, which will help you locate the entire BUG, and then read the information above which is to repeat the constant, Then go to line 234 of test.html, and you’ll see

Obviously, the const constant a has been set twice, so an error is reported

Look for BUG 3

In addition to javascript errors, common errors include code logic errors, such as deadlocks, etc., when the code does not report errors, but you do not have the desired effect, you need to consider this type of error. This is a mistake I usually avoid in several ways:

    1. With TS code, using strong typing can avoid many of these errors
    1. The ability to use browser breakpoint bugs has been mentioned in many articles, but not in many.
    1. Use console.log to print the data of key nodes to avoid slow debugging. In this case, it is recommended to use dichotomy to eliminate the problem and compare the logn rate to be faster

Find BUG 4

We will also encounter webPack and Babal errors many times while building a project, which is a convenient error

First: check whether the overall configuration file has a name or file name, file location mismatch.

Second: Install the required node_module or other required dependencies based on the error.

Third: read the official documents and issues are version bugs, through the upgrade or downgrade version to solve

Afterword.

These are my common ways to change the BUG, I hope you can share your way to find the BUG to learn together, I feel that this is an important knowledge point we can quickly integrate into the development.