How to detect the memory allocations that are triggering garbage collection in JavaScript?

前端未结

关注

 1  1304

While looking for performance issues in a JavaScript library (rivets), i found that garbage collection occurs three to four times in a run, taking ~15% of execution time (us

相关标签:

1条回答

广开言路

2020-12-07 03:47
At Profiles tab at DevTools select Record Heap Allocation. Wrap javascript which should be evaluated within a call to setTimeout() with a duration set to enough time to click Start before function passed to setTimeout is called; for example
```
<!DOCTYPE html>
<html>
<head>
  <script>
    t = 5;
    setTimeout(function() {
      (function test1() {
        var a = 123;
        function abc() {
          return a
        }
        abc();
      }());
    }, 10000)
  </script>
</head>
<body></body>
</html>
```
When setTimeout is called a blue bar, possibly followed by a gray bar should appear at timeline. Click Ctr+E to stop recording heap profile.

Select blue or gray bar at timeline graph. Select Containment at dropdown menu where default option is Summary. Select
```
[1] :: (GC roots) @n
```
where n is a number.

Expand the selection by clicking triangle to left of [1] :: (GC roots). Select an element of [1] :: (GC roots), review the displayed Distance, Shallow Size, and Retained Size columns for the selection.

To check specific functions, scroll to
```
[2] :: (External strings) @n
```
to where global variables and function calls should be listed; i.e.g., "t" and "setTimeout" from above javascrip. Check corresponding Distance, Shallow Size, and Retained Size columns for the selection.
0 讨论(0)
发布评论:

提交评论
- 加载中...