# P5.js copy function slow performance since version 0.10.0

**URL:** https://discourse.processing.org/t/p5-js-copy-function-slow-performance-since-version-0-10-0/30007
**Category:** p5.js
**Created:** [May 10, 2021, 6:59am UTC](https://discourse.processing.org/t/p5-js-copy-function-slow-performance-since-version-0-10-0/30007 "2021-05-10T06:59:59Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![Esi](https://avatars.discourse-cdn.com/v4/letter/e/9f8e36/32.png) [@Esi](https://discourse.processing.org/u/Esi)
#### Post date: [May 10, 2021, 6:59am UTC](https://discourse.processing.org/t/p5-js-copy-function-slow-performance-since-version-0-10-0/30007/1 "2021-05-10T06:59:59Z")

</div>

Hey everyone,  
my question is about the copy function. As many before I tried to recreate the tutorial of Tim Rodenbröcker about kinetic typography with p5.

It runs very slow (3fps) in the current p5 version 1.3.1, but **when I change the version to 0.9.0 it reaches up to 60fps**. The performance drop appeared since version 0.10.0. In the release notes on github for version 0.10.0 I found out, that “copy() now works with 2D and WebGL”. I am not sure if it has something to do with that, but maybe it is a starting point.

I append two examples with the same code, one with p5 version 0.9.0 and the other with version 1.3.1.  
[https://editor.p5js.org/eriksiemund/sketches/ZD7V3\_qKM](https://editor.p5js.org/eriksiemund/sketches/ZD7V3_qKM)  
[https://editor.p5js.org/eriksiemund/sketches/79w6n7V2W](https://editor.p5js.org/eriksiemund/sketches/79w6n7V2W)

Can someone help me figure out, how to fix this problem?

Thank you in advance!

---

<div class="post-metadata">

### Author: ![micuat](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/micuat/32/19407_2.png) [@micuat](https://discourse.processing.org/u/micuat)
#### Post date: [May 10, 2021, 11:21am UTC](https://discourse.processing.org/t/p5-js-copy-function-slow-performance-since-version-0-10-0/30007/2 "2021-05-10T11:21:55Z")

</div>

Hi! Welcome to the forum!

This looks like a strange case. Comparing the code, there seems only an addition for the case for webgl.

0.9.0: [p5.js/p5.Renderer2D.js at 0.9.0 · processing/p5.js · GitHub](https://github.com/processing/p5.js/blob/0.9.0/src/core/p5.Renderer2D.js#L237)  
current: [p5.js/pixels.js at 374acfb44588bfd565c54d61264df197d798d121 · processing/p5.js · GitHub](https://github.com/processing/p5.js/blob/374acfb44588bfd565c54d61264df197d798d121/src/image/pixels.js#L257)

When I replace `copy` with `context.drawImage` in your code, the performance is fine (comparable to 0.9.0)

[https://editor.p5js.org/micuat/sketches/XXyKscqN9](https://editor.p5js.org/micuat/sketches/XXyKscqN9)

Then I noticed that, while I haven’t dug further, `loadPixels`’ implementation might have changed. If you add `pg.loadPixels` to the above sketch, performance drops significantly. I believe that for `context.drawImage` there is no need to do `loadPixels` and this is causing the performance issue. Can you open an issue on github, link this forum and suggest a change?

---

<div class="post-metadata">

### Author: ![Esi](https://avatars.discourse-cdn.com/v4/letter/e/9f8e36/32.png) [@Esi](https://discourse.processing.org/u/Esi)
#### Post date: [May 10, 2021, 12:15pm UTC](https://discourse.processing.org/t/p5-js-copy-function-slow-performance-since-version-0-10-0/30007/3 "2021-05-10T12:15:19Z")

</div>

Thank you micuat!

I opened a new issue and I hope that I quoted you correctly:  
[copy function slow performance since v0.10.0 · Issue #5237 · processing/p5.js (github.com)](https://github.com/processing/p5.js/issues/5237)

Maybe just for other beginners like me:  
slow since v0.10.0: `copy(pg, sx, sy, sw, sh, dx, dy, dw, dh);`  
temporary solution by micuat: `drawingContext.drawImage(pg.canvas, sx, sy, sw, sh, dx, dy, dw, dh);`