Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

195
Views
Is there a way to efficiently update a grid in Javascript

I'm creating a project site that is essentially a music visualizer. https://218studio.com/space_trip.php

Tutorial was taken from "The Coding Train" https://www.youtube.com/watch?v=IKB1hWWedMk

The problem that I'm running into is that the algorithm to compute the and update the grid in the draw() function is running in n squared time.

  for (var y = 0; y < rows - 1; y++) {
    beginShape(TRIANGLE_STRIP);
    var xoff = 0; 
    for (var x = y; x < cols - y; x++) {
      terrain[x][y] = map(noise(xoff, yoff), 0, 1, -100, 100);
      xoff += 0.2;
      vertex(x * scl, y * scl, terrain[x][y] * size);
      vertex(x * scl, (y + 1) * scl, terrain[x][y] * size);
    }
    yoff += 0.2; 
    endShape();

  }

The current site takes about 30% of my gpu's capacity to run smoothly. However, that is on a 2080ti with a 10700 processor. When demoing for my friend the grid lags his laptop so much the sound does not play properly.

Solutions that I've tried implementing locally are to reduce the grid density and to only render the squares visible on the computer screen, but that only reduces the gpu usage by about 4%.

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!