# shadowBlur on circles Particles

**URL:** <https://discourse.processing.org/t/shadowblur-on-circles-particles/23180>\
**Category:** Coding Questions\
**Created:** [August 11, 2020, 4:51am UTC](https://discourse.processing.org/t/shadowblur-on-circles-particles/23180 "2020-08-11T04:51:23Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![TienLe](https://avatars.discourse-cdn.com/v4/letter/t/e274bd/32.png) [@TienLe](https://discourse.processing.org/u/TienLe)\
**Post date:** [August 11, 2020, 4:51am UTC](https://discourse.processing.org/t/shadowblur-on-circles-particles/23180/1 "2020-08-11T04:51:23Z")

</div>

I have some problems when using shadowBlur, I created particles just like this [https://p5js.org/examples/simulate-particles.html](https://p5js.org/examples/simulate-particles.html)  
But when I using this code to make a shadowBlur on circles, it’s very lag and bad performance

```auto
createParticle() {
    noStroke();
    fill('rgba(200,169,169,0.5)');
    drawingContext.shadowBlur = 10; // this line
    drawingContext.shadowColor = 'white'; // this line
    circle(this.x,this.y,this.r);
  }

```

I wanna drawing circles like this and multiple colors. This image is an example for one color:

> **[Blue](https://anh4.com/image/CZaaDH)**
>
> Ảnh Blue lưu trữ tại Anh4

  
Thank you so much

---

<div class="post-metadata">

**Author:** ![Sven](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/sven/32/8293_2.png) [@Sven](https://discourse.processing.org/u/Sven)\
**Post date:** [August 12, 2020, 7:16am UTC](https://discourse.processing.org/t/shadowblur-on-circles-particles/23180/2 "2020-08-12T07:16:39Z")

</div>

p5.js is excellent in many ways, but its not always the most efficient and performant way to push pixels to your screen. Depending on your computer and what the sketch is doing, you may experience slow frame rates. The example you provide renders at 20 FPS on my machine (compared to 60 FPS for the version without blur).

That said, there are things you can to [optimize p5.js code for performance](https://github.com/processing/p5.js/wiki/Optimizing-p5.js-Code-for-Performance#identifying-slow-code-profiling). You could also try switching rendering mode from the default P2D to WebGL. WebGL makes better use of the graphics card, and that will probably get rid of the lag you’re experiencing.

[Getting started with WebGL in p5](https://github.com/processing/p5.js/wiki/Getting-started-with-WebGL-in-p5) is a good read.
