# Slow render in WebGL
**URL:** https://discourse.processing.org/t/slow-render-in-webgl/25051
**Category:** Coding Questions
**Created:** [October 30, 2020, 3:35pm UTC](https://discourse.processing.org/t/slow-render-in-webgl/25051 "2020-10-30T15:35:52Z")
**Posts on this page:** 5
**Page:** 1
### Author:  [@Tahsin](https://discourse.processing.org/u/Tahsin)
#### Post date: [October 30, 2020, 3:35pm UTC](https://discourse.processing.org/t/slow-render-in-webgl/25051/1 "2020-10-30T15:35:52Z")
Hey, I want to make a terrain generator in p5. So, I need WebGL to rotate the canvas on X axis. But, even trying to render 500 lines makes the whole sketch extremely slow. If I remove the `WEBGL`, the sketch runs pretty fast. Can someone please help?
```auto
let l = []
function setup() {
createCanvas(windowWidth, windowHeight, WEBGL);
background(0)
for(let i=0; i<500; i++){
l.push([random(width), random(height)])
}
}
function draw() {
background(0)
//WebGL translates everything to the middle of the screen. This is to fix that
translate(-width, -height)
// I want the shape to follow my mouse
translate(mouseX, mouseY)
beginShape()
for (i of l){
vertex(i[0], i[1])
ellipse(i[0], i[1], 10, 10)
}
endShape(CLOSE)
}
```
---
### Author:  [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [November 2, 2020, 8:51am UTC](https://discourse.processing.org/t/slow-render-in-webgl/25051/2 "2020-11-02T08:51:55Z")
Not sure about ellipse statement within beginShape
You can make the full PShape in setup and in draw just say shape(s);
---
### Author:  [@glv](https://discourse.processing.org/u/glv)
#### Post date: [November 2, 2020, 11:25am UTC](https://discourse.processing.org/t/slow-render-in-webgl/25051/3 "2020-11-02T11:25:10Z")
Hello,
Examples here:
> **[3D Terrain Generation with Perlin Noise in Processing](https://thecodingtrain.com/CodingChallenges/011-perlinnoiseterrain.html)**
>
> In this coding challenge, I create a 3D procedural terrain using Perlin Noise and the beginShape() function in Processing.
I did get a steady frameRate of 60 when I changed the scale.
`:)`
---
### Author:  [@glv](https://discourse.processing.org/u/glv)
#### Post date: [November 2, 2020, 11:26am UTC](https://discourse.processing.org/t/slow-render-in-webgl/25051/4 "2020-11-02T11:26:16Z")
> [@Chrisir](#):
>
> You can make the full PShape in setup and in draw just say shape(s);
I could not find a PShape reference for P5.js
Related:
>
>
> http://processing.org/reference/PShape.html
> \#### Shape
> \- PShape
> \- createShape()
> …- loadShape()
> \#### Loading & Displaying
> \- shape()
> \- shapeMode()
>
> Later version!
`:)`
---
### Author:  [@noel](https://discourse.processing.org/u/noel)
#### Post date: [November 5, 2020, 4:01am UTC](https://discourse.processing.org/t/slow-render-in-webgl/25051/5 "2020-11-05T04:01:54Z")
Since you are not changing data in draw(), construct a p5.Graphics with createGraphics() in setup() and move the resulting image() in draw().