There are no leaks displayed in Chrome Dev Tools, however, the Task Manager will show them until Chrome eventually crashes

Do you have a CPU-intensive application that you're working on? Check it out here: https://codepen.io/team/amcharts/pen/47c41af971fe467b8b41f29be7ed1880

It involves a Canvas on which various elements are constantly being drawn.

Here's the HTML snippet:

<script src="https://cdn.amcharts.com/lib/5/index.js"></script>
<script src="https://cdn.amcharts.com/lib/5/xy.js"></script>
<script src="https://cdn.amcharts.com/lib/5/themes/Animated.js"></script>
<div id="chartdiv" style="width:100%; height:400px"></div>

And here's a glimpse of the JavaScript code involved:

[JavaScript code snippet]

However, running this application for an extended period seems to cause Chromium-based browsers to crash. Surprisingly, the memory-related metrics in Dev Tools don't indicate any leaks. The peculiar thing is that manipulating the chart (like zooming out or resizing the window) helps stabilize the memory usage. This issue appears only in Chromium browsers, not in Firefox. Any insights on what might be causing this would be greatly appreciated!

javascriptmemory-leaks

Answer â„–1

It has been confirmed that the issue at hand is related to Chromium. Specifically, when the setTransform function is called on a context without any additional actions, it leads to a memory leak (which is not detected during profiling) and eventually causes a crash. A bug report has been submitted and we hope for a resolution soon. In the meantime, we are actively developing a workaround to prevent this problem from occurring.

var canvas = document.createElement('canvas');
document.body.appendChild(canvas);

var context = canvas.getContext('2d');

function loop() {
  requestAnimationFrame(() => {
    loop();

    for (var j = 0; j < 10000; ++j) {
      context.setTransform(0.5, 1, 1, 0.5, 1, 1);
    }
  });
}

loop();

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Attempting to create a login and registration form

Hello, I am attempting to create a form that can generate new user accounts and passwords. These values should be stored from the input tag when the user clicks on the register button. Unfortunately, I am encountering an issue where clicking the register ...

javascripthtmlcss

Achieve seamless integration of PHP function execution with Javascript onClick without the need for page

After delving into my research, it seems like Ajax and/or JQuery may be the way to go for what I'm trying to achieve. However, I wanted to double-check before moving forward in that direction. The task at hand involves using a javascript onclick func ...

javascriptphpjquery

The error message "this.props.navigation" is not defined and cannot be evaluated as an object

Recently, I encountered an issue with my navigation system. Within my application, there are 3 screens or components that I navigate between using react-navigation. The first screen prompts the user to enter their mobile phone number and password, which is ...

javascriptreactjsreact-native

Updating an array in Vue.js without the need to reload all the data

Recently delving into Vue.js and JavaScript, I'm seeking guidance on updating an array (on Add/Edit/Delete) without having to reload all the data. The goal is to load all data only when initially opening the page with Addresses. Take a look at my cod ...

javascriptvue.jsvuejs2

Generate Array of Consecutive Dates using JavaScript

My array contains the following values (for example): [ 1367848800000: true, 1367935200000: true, 1368021600000: true, 1368108000000: true, 1368194400000: true, 1368367200000: true, 1368540000000: true, 1 ...

javascriptjquerydatefullcalendar

The URL routing in Vue-router seems to be incorrect as it directs to the wrong page. To fix this issue, make sure to include a '#' before the

Welcome to my website! Check out my home page here: https://i.sstatic.net/znfq0.jpg If you're interested in reading my blog, visit the blog page here: https://i.sstatic.net/oiYSY.png I've built this site using vue3. Here's a snippet of th ...

javascriptvue.jsvue-routervuejs3vue-router4

Executing code within Vue js $set method's callback

For my v-for loop that generates a list of flights, I have implemented functionality where the user can click on a "flight details" button to send an AJAX request to the server and append new information to the results array. To update the view accordingly ...

javascriptvue.js

Encountering a 404 error for core.js and browser.js while loading an Angular 2 app through system.src.js

I am new to Angular2 and have followed the Angular2 quickstart and tutorial to get started. Just to provide some context, when a user clicks on a link in the top navigation bar of my webapp, it triggers a server side request. The resulting page returned t ...

javascriptnode.jstypescriptangular

I'm encountering an issue with my function in Vuejs where it is only going through one loop before breaking out. How can I

I'm attempting to validate all items in the cart and disable the sell button if the item is already in the cart (I have this implemented for other functionalities). It seems like my loop is only iterating once before stopping. Any suggestions on how I ...

javascriptperformancevue.js

Leveraging a service variable in Angular

Is there a way to access data shared in a service within a directive? Let's say we have a directive called resultsDirective, and a service named dataService. How can we retrieve a variable from the service within the directive? angular.module("someMo ...

javascriptangularjs

Are you interested in using jQuery and/or AJAX to retrieve the latest images from a website?

I had to utilize a Wikipedia API in order to retrieve images from the New Jersey website, and I devised two methods to carry out similar tasks. The initial approach involved using JSON, but it ended up pulling the entire page content. <script type="tex ...

javascriptjqueryajax

Currently, I am developing a Vue.js chat application. I am facing a challenge when it comes to sending the entire input div along with the keyboard popping up on Android devices. How can I achieve this

I'm in the process of developing a chat application using vuejs that will be accessed through a webview on Android. I currently have an input-bx element for sending messages, but I need to find a way to ensure it remains visible when the Android keybo ...

javascriptvue.jsvuejs2chat

When using $http in AngularJS, an error may occur when it

I ran a test on my PHP code independently and obtained the following output: {"tabId":1,"tabName":"Main","uId":"1"}{"tabId":2,"tabName":"Photography","uId":"1"} However, my AngularJS application is unable to receive the callback and is throwing an error ...

javascriptphpangularjs

What is the best way to conceal a div when there are no visible children using AngularJS?

I need help with hiding a parent div only if all the child items are invisible. I have successfully hidden the parent when there are no children, but I am struggling to figure out how to hide it based on visibility. <div ng-repeat="group in section.gro ...

javascriptjqueryhtmlangularjsvisibility

Obscured painting surface appearance using Three.js

I am attempting to incorporate a blurred texture into my Three.js scene, but the results are not what I expected. Canvas: var c = document.getElementById("myCanvas"); var context1 = c.getContext("2d"); context1.filter = "blur(16px)"; context1.beginPath( ...

javascriptthree.js

Discover the sequence that is the smallest in lexicographical order possible

Here is the question at hand Given a sequence of n integers arr, find the smallest possible lexicographic sequence that can be obtained after performing a maximum of k element swaps, where each swap involves two consecutive elements in the sequence. Note: ...

javascriptarraysalgorithmlexicographic

Tips for replacing spaces with &nbsp; in a string using ReactJS and displaying it in HTML

<div className="mt-2 font-sidebar capitalize"> {item.title} </div> item.title can vary and be any string retrieved from the backend, such as "all products", "most liked", "featured items", etc. I am looking for a solution to subst ...

javascripthtmlreactjsstringnext.js

An error occurred stating 'TypeError: jsdom.jsdom is not a function' while using the paper-node.js in the npm paper module

Recently, I added the webppl-agents library to my project, including webppl and webppl-dp. However, when attempting to execute the command line test, I encountered some difficulties. It seems that there is a dependency problem with jsdom from the npm paper ...

javascriptnode.jsnpmtypeerrorjsdom

Filtering an array within an array based on user input

I am currently facing a challenge in filtering the child elements of an array. I am puzzled on how to specifically target children elements. So far, my filter is only functioning at the top level. Array: options: [ {name: 'Ð’Ñ‹Ñ…Ð ...

javascriptvue.js

Using JavaScript to place markers on a Google Map may encounter an issue with a for

Close to solving a three-day challenge. Currently working on placing markers on a Google Map using latitudes and longitudes stored in a Django model. This is my first time using AJAX, but I'm giving it a shot to make this work. Firebug is pointing out ...

javascriptajaxgoogle-maps-markers