# Problem with delete shader for optimization
**URL:** https://discourse.processing.org/t/problem-with-delete-shader-for-optimization/39523
**Category:** Coding Questions
**Created:** [October 31, 2022, 4:07pm UTC](https://discourse.processing.org/t/problem-with-delete-shader-for-optimization/39523 "2022-10-31T16:07:22Z")
**Posts on this page:** 6
**Page:** 1
### Author:  [@Omri](https://discourse.processing.org/u/Omri)
#### Post date: [October 31, 2022, 4:07pm UTC](https://discourse.processing.org/t/problem-with-delete-shader-for-optimization/39523/1 "2022-10-31T16:07:22Z")
hey 🙂
I have a big sketch with a lot of shaders that I use at different times.
so for optimizations, I want to delete the PGraphics and the shaders that I don’t want to use anymore.
(As recommended here: [WebGL best practices - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/WebGL_best_practices#delete_objects_eagerly))
I want to use the function `WebGLRenderingContext.deleteShader()` as described here:
[WebGLRenderingContext.deleteShader() - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/deleteShader)
but I get this error:
`TypeError: pg.deleteShader is not a function`
what can I do?
and on that note: do you have any tips for optimizing a lot of shaders in p5? 🙃
here is the code for the sketch:
```auto
let theShader;
function preload() {
theShader = loadShader("shader.vert", "shader.frag");
}
function setup() {
pixelDensity(1);
createCanvas(windowWidth, windowHeight, WEBGL);
pg = createGraphics(width, height, WEBGL);
noStroke();
console.log("DONE SET UP");
}
function draw() {
push();
translate(-width / 2, -height / 2);
pg.shader(theShader);
theShader.setUniform("u_resolution", [width, height]);
pg.rect(0, 0, width, height);
image(pg, 0, 0);
pop();
}
function keyPressed() {
pg.deleteShader(theShader);
pg.remove();
pg = null;
}
```
(the shader is the most basic one so I won’t put it here, but here is the editor so its in there and also you can run it there:
> **[p5.js Web Editor](https://editor.p5js.org/omribergman05/sketches/pdcznRJys)**
>
> A web editor for p5.js, a JavaScript library with the goal of making coding accessible to artists, designers, educators, and beginners.
thank you
---
### Author:  [@josephh](https://discourse.processing.org/u/josephh)
#### Post date: [October 31, 2022, 4:31pm UTC](https://discourse.processing.org/t/problem-with-delete-shader-for-optimization/39523/2 "2022-10-31T16:31:34Z")
Hi @Omri,
> [@Omri](#):
>
> I want to use the function `WebGLRenderingContext.deleteShader()` as described here:
> [WebGLRenderingContext.deleteShader() - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/deleteShader)
You can access the rendering context from the canvas:
```javascript
const canvas = createCanvas(400, 400, WEBGL);
canvas.drawingContext.deleteShader(shader);
```
Source code:
>
---
### Author:  [@Omri](https://discourse.processing.org/u/Omri)
#### Post date: [October 31, 2022, 5:20pm UTC](https://discourse.processing.org/t/problem-with-delete-shader-for-optimization/39523/3 "2022-10-31T17:20:26Z")
thank you for all your help!
I changed it as you suggested, but I needed to declare the canvas as a global parameter, I I couldn’t use `const`. I wrote like that:
```auto
let canvas;
function setup() {
canvas = createCanvas(windowWidth, windowHeight, WEBGL);
...
}
```
is that what you meant?
now when I’n trying to delete the shader like that: ` canvas.drawingContext.deleteShader(theShader);`
I get this error:
`TypeError: Failed to execute 'deleteShader' on 'WebGLRenderingContext': parameter 1 is not of type 'WebGLShader'.`
and in another sketch I’m running not in the web editor I get this error:
`Uncaught TypeError: canvas.drawingContext.deleteShader is not a function`
---
### Author:  [@josephh](https://discourse.processing.org/u/josephh)
#### Post date: [November 1, 2022, 5:24pm UTC](https://discourse.processing.org/t/problem-with-delete-shader-for-optimization/39523/4 "2022-11-01T17:24:40Z")
> [@Omri](#):
>
> TypeError: Failed to execute ‘deleteShader’ on ‘WebGLRenderingContext’: parameter 1 is not of type ‘WebGLShader’.
I suppose you are using [`createShader()`](https://p5js.org/reference/#/p5/createShader) which is a wrapper around `WebGLShader` so you can’t pass it directly to `deleteShader`…
Maybe you want to delete both vertex and fragment shader, they are hidden attributes:
```javascript
const shader = createShader(...);
canvas.drawingContext.deleteShader(shader._vertShader);
canvas.drawingContext.deleteShader(shader._fragShader);
```
I didn’t tested it but maybe it causes bugs and it’s hacky
---
### Author:  [@Omri](https://discourse.processing.org/u/Omri)
#### Post date: [November 5, 2022, 9:58pm UTC](https://discourse.processing.org/t/problem-with-delete-shader-for-optimization/39523/5 "2022-11-05T21:58:39Z")
@josephh thank you for your help!
I’m using the
```auto
canvas.drawingContext.deleteShader(shader._vertShader);
canvas.drawingContext.deleteShader(shader._fragShader);
```
it fixed the last thing, but now I have this warning:
`sketch.js:534 WebGL: INVALID_OPERATION: delete: object does not belong to this context`
and it doesn’t delete the shader.
Do you know what is it?
---
### Author:  [@josephh](https://discourse.processing.org/u/josephh)
#### Post date: [November 6, 2022, 10:43am UTC](https://discourse.processing.org/t/problem-with-delete-shader-for-optimization/39523/6 "2022-11-06T10:43:23Z")
First of all, how many shaders do you have? Do you think it really makes a difference in terms of memory and computation?
> [@Omri](#):
>
> `sketch.js:534 WebGL: INVALID_OPERATION: delete: object does not belong to this context`
> and it doesn’t delete the shader.
Maybe the shader was already deleted by the garbage collector that’s why you can’t delete it again.