问题
Lets say I have a web app which is slow and I want to identify possible bottlenecks. I First would go into the network tab and see if the server is the problem, if network calls are okay then I should proceed with performance and memory tabs?
What is the use case of the performance tab and the use cases of the memory tab?
回答1:
What is the use case of the performance tab and the use cases of the memory tab?
The Performance panel gives you a complete view of the performance of a page during a recording. This includes network requests, JS execution, parsing, rendering, painting, etc.
The Memory panel gives you detailed views into how a page is using memory. People mostly use it to debug memory issues. When a page gets progressively slower as you use it, that's sometimes a memory leak. When a page is consistently slow, that's sometimes a page that is using too much memory.
Lets say I have a web app which is slow and I want to identify possible bottlenecks. I First would go into the network tab...
Actually, I recommend starting with the Performance panel. It can show you network activity, as well as a bunch of other page activity. Go to the Network panel after you've identified that the problem is a network problem.
- See Get Started With Runtime Performance to get familiar with the Performance panel.
- Record the page load.
Once you've got a recording, there's a bunch of different sections on the Performance panel that can help you spot various bottlenecks:
- The Network section can help you spot network bottlenecks.
- The Memory section can help you see memory usage.
- The Main section shows you JS, parsing, rendering, and painting activity.
See Performance Analysis Reference for lots more on the Performance panel.
来源：https://stackoverflow.com/questions/44776512/how-to-know-when-to-use-chrome-dev-tools-performance-vs-memory-tab