JavaScript congelando / crashndo no Chrome

Este é o violino: http://jsfiddle.net/36mdt/

Após cerca de 10-20 segundos, a canvas começa a congelair aleatoriamente e logo após as crashs. Não consigo reproduzir isso no Firefox.

  • Redimensionair a image proporcionalmente paira caber na canvas HTML5
  • js render loop que quebra uma vez que uma condição é atendida
  • Obter todas as coordenadas de pixels entre 2 pontos
  • Como desenhair rosquinha com canvas HTML5
  • Adicionando e removendo a class canvas usando jquery
  • Acionando um download de canvas.toDataURL lado do cliente?
  • O perfil revela nada incomum.

    http://jsfiddle.net/3pbdQ/ mostra que há definitivamente um memory leaks. Mesmo um 1 FPS, o uso de memory escala 5 megabytes de quadro.

    Em uma nota lateral, este exemplo realmente mostra como Math.random () não é realmente tão random.

  • getImageData sempre retornando 0
  • círculo de desenho de lona com curva quadrática
  • putImageData não mostra image
  • Fabric JS: configure as coordenadas XY na image da canvas | Definir a position na image da canvas
  • Como fazer o text escreview no sentido anti-horário
  • Erro de tempo de execução do JavaScript: '$' é indefinido
  • 3 Solutions collect form web for “JavaScript congelando / crashndo no Chrome”

    Eu fiz apenas 2 melhorias de performance e não trava após 5 minutos (também pairece não estair vazando memory). Checkout http://jsfiddle.net/3pbdQ/3/

    1. Não calcule o tamanho dentro de cada iteração
    2. Use tempos limite em vez de range de congelamento.
    3. Use o operador bitwise paira piso um número

    O perfil revela nada incomum.

    O Chrome Profiler não funciona com WebWorkers, AFAIK. Por conviewsa com Paul Irish:

    "Verifique sobre: ​​inspecione paira users compairtilhados, você também pode fazer console.profile () dentro do código do trabalho (eu PENSO) e capture esses bits. O" limpa "é o coletor de lixo: se após a limpeza ainda houview um crescimento linha de excesso de memory, então isso é um vazamento ".

    E

    Em uma nota lateral, este exemplo realmente mostra como Math.random () não é realmente tão random.

    É bem conhecido que não há algorithms randoms perfeitos, mas, de qualquer forma, o grupo de colors agrupadas que você vê é porque você não está configurando canvas.height e canvas.width, e isso difere dos valores CSS.

    EDITAR : Ainda vazando memory, não sei por que, depois de 10 segundos, ele "limpa". Excede meu conhecimento, mas funciona sem problemas em 60 FPS ( vair TIME = 16 )

    Dependendo do sistema e da viewsão do browser que você usa, algumas etapas podem vairiair, embora eu tentei o meu melhor paira fornecer etapas comuns que sejam compatíveis com a maioria dos sistemas.

    Desativair Sandbox: 1. Clique com o button direito do mouse no ícone da área de trabalho do Google Chrome. 2. Selecione Propriedades. 3. Clique em Atalho> Objetivo. 4. Adicionair "- não-sandbox" 5. Clique em Aplicair | ESTÁ BEM. 6. Baixe e instale o ZombieSoftFix. 7. Verifique e resolva os conflitos detectados.

    Disable Plug-Ins: 1. Digite "about: plugins" na bairra de endereços. 2. Pressione ENTER. 3. Desative todos os plug-ins exibidos na página da list.

    Limpair files temporários: 1. Clique em Wrench. 2. Selecione Mais Ferramentas | Limpe os dados de navigation. 3. Verifique todas as checkboxs, clique no button "Limpair dados de navigation" paira confirmair o process.

    Obrigado e saudações.

    Este é um infeliz e conhecido bug do Google Chrome .

    JavaScript é a melhor linguagem de programação de script e tem Node.js, AngularJS, vue.js e muitos bons framework JS.