# Sketch behaves differently on macbook and raspi

**URL:** <https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145>\
**Category:** Coding Questions\
**Created:** [September 15, 2025, 2:51am UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145 "2025-09-15T02:51:49Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![noahhsmith](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noahhsmith/32/21058_2.png) [@noahhsmith](https://discourse.processing.org/u/noahhsmith)\
**Post date:** [September 15, 2025, 2:51am UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/1 "2025-09-15T02:51:49Z")

</div>

Hi, this sketch was created on a macbook and works fine there - [decwar / galaxy · GitLab](https://gitlab.com/decwar/galaxy)  
There’s a grid of white dots, and then some white squares superimposed, as shown in the pic below.

On raspi, the grid of white dots appears but then vanishes when the white squares appear… Any ideas why it behaves differently on raspi?

Cheers, Noah

 ![PXL_20250914_072640955](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/3X/4/6/4664501373129e6e0f174eacc332c3b7cfcf47b9.jpeg)

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [September 15, 2025, 4:28am UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/2 "2025-09-15T04:28:36Z")

</div>

> [@noahhsmith](#):
>
> There’s a grid of white dots, and then some white squares superimposed,

Given that grid is always the same (static drawing), you could draw it once on a [p5.Graphics](https://p5js.org/reference/p5/p5.Graphics/) using **createGraphics()** inside **setup()**:

> **[createGraphics](https://p5js.org/reference/p5/createGraphics/)**
>
> createGraphics

Then in **draw()**, use **image()** to display it before drawing the **square()** ships.

---

<div class="post-metadata">

**Author:** ![noahhsmith](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noahhsmith/32/21058_2.png) [@noahhsmith](https://discourse.processing.org/u/noahhsmith)\
**Post date:** [September 15, 2025, 6:01am UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/3 "2025-09-15T06:01:31Z")

</div>

Thanks @GoToLoop - this is a good idea in all cases, to have the background ‘static’. Will try to get that working. Meanwhile, while trying that, discovered something else that does work. Can see it in the repo now. Just need to do the loadData(), not ‘re display’ ships. Commenting out that second display() made things look as expected on raspi.

```
if (frameCount % 10 === 0) { // every 60 frames (\~once per second at 60fps)
    loadData();
    // for (let i = 0; i < ships.length; i++) {
    // ships\[i\].display();
    // }
}

```

Will keep trying with the static background and update here soon - Thanks! Noah

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [September 15, 2025, 6:26am UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/4 "2025-09-15T06:26:47Z")

</div>

> [@noahhsmith](#):
>
> Just need to do the **loadData()**, not ‘re display’ ships.

The whole _frameCount_ block doesn’t make much sense.

Also, **loadData()** is a misnomer, given it doesn’t load anything, but populates the Ship array w/ the already loaded JSON.

I’d rename it to something like **populateShipArray()** and call it once from **preload()**:

```js
const ships = [];
var data;

function preload() {
    data = loadJSON('galaxy.json', populateShipArray);
}

function populateShipArray(data) {
    ships.length = 0;

    for (const ship of data.ships) {
        const { position: { v, h }, name } = ship;
        ships.push( new Ship(v, h, name) );
    }
}

```

If you feel the need to create some **reset()** function in order to bring the sketch to its initial state, you’d re-invoke **populateShipArray()** passing the original _data_ JSON object within **reset()**:

```js
function reset() {
    populateShipArray(data);
}

```

---

<div class="post-metadata">

**Author:** ![noahhsmith](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noahhsmith/32/21058_2.png) [@noahhsmith](https://discourse.processing.org/u/noahhsmith)\
**Post date:** [September 15, 2025, 7:12am UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/5 "2025-09-15T07:12:44Z")

</div>

Hmmm, it’s key that the loadData() in the frameCount block does read the json file each time. The json file is changing, it’s being written/rewritten periodically by another process (a python robot-player connected to the PDP-10). So the frameCount block is refreshing / updating / redisplaying the ‘state of the ships’. Core idea:) The ships aren’t static, only the background grid is static 👍

---

<div class="post-metadata">

**Author:** ![noahhsmith](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noahhsmith/32/21058_2.png) [@noahhsmith](https://discourse.processing.org/u/noahhsmith)\
**Post date:** [September 15, 2025, 7:23am UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/6 "2025-09-15T07:23:52Z")

</div>

Having the background grid displayed ‘statically’ should help in other ways - the refresh / redisplay causes a noticeable ‘wipe / flicker’ on both mac and raspi - hopefully the background grid is main cause of that. And cpu usage is up by 40% on raspi, hopefully reduces that as well 😀

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [September 15, 2025, 7:52am UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/7 "2025-09-15T07:52:00Z")

</div>

> [@noahhsmith](#):
>
> So the _frameCount_ block is refreshing / updating / redisplaying the ‘state of the ships’.

You could include a **setInterval()** in **setup()**, so it keeps re-invoking **preload()** after each INTERVAL:

> **[Window: setInterval() method - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/Window/setInterval)**
>
> The setInterval() method of the Window interface repeatedly calls a function or executes a code snippet, with a fixed time delay between each call.

```js
const ships = [], INTERVAL = 2000; // 2 seconds

function populateShipArray(data) {
    ships.length = 0;

    for (const ship of data.ships) {
        const { position: { v, h }, name } = ship;
        ships.push( new Ship(v, h, name) );
    }
}

function preload() {
    loadJSON('galaxy.json', populateShipArray);
}

function setup() {
    // ...

    setInterval(preload, INTERVAL);
}

```

---

<div class="post-metadata">

**Author:** ![GoToLoop](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/gotoloop/32/86_2.png) [@GoToLoop](https://discourse.processing.org/u/GoToLoop)\
**Post date:** [September 15, 2025, 8:19am UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/8 "2025-09-15T08:19:39Z")

</div>

> [@noahhsmith](#):
>
> And CPU usage is up by 40% on RasPi,

Rather than re-populating & re-instantiating ships after each JSON loading, we could instead just update each existing ship w/ the newly-arrived coordinates:

```js
"use strict";

// ...

const ships = [], INTERVAL = 1000; // 1 second

function populateShipArray(data) {
    ships.length = 0;

    for (const ship of data.ships) {
        const { position: { v, h }, name } = ship;
        ships.push( new Ship(v, h, name) );
    }
}

function updateShipArray(data) {
    const shipData = data.ships;
    if (shipData.length > ships.length) return populateShipArray(data);

    const len = ships.length = shipData.length;

    for (var i = 0; i < len; ++i) {
        const { position: { v, h } } = shipData[i];
        ships[i].x = v; ships[i].y = h;
    }
}

function preload() {
    loadJSON('galaxy.json', populateShipArray);
}

function setup() {
    // ...

    setInterval(() => loadJSON('galaxy.json', updateShipArray), INTERVAL);
}

```

---

<div class="post-metadata">

**Author:** ![noahhsmith](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noahhsmith/32/21058_2.png) [@noahhsmith](https://discourse.processing.org/u/noahhsmith)\
**Post date:** [September 15, 2025, 10:02pm UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/9 "2025-09-15T22:02:32Z")

</div>

Huge thanks these are great ideas! Some are over my head but have a rough idea what they’re for 😀 Went ahead and put as much as possible in and have it running. Can see it in the repo. Hmmm, ships do get destroyed and/or change so looking at updateShipArray(), something like shipData.length != ships.length. Experimenting with that now!🙂

---

<div class="post-metadata">

**Author:** ![noahhsmith](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noahhsmith/32/21058_2.png) [@noahhsmith](https://discourse.processing.org/u/noahhsmith)\
**Post date:** [September 15, 2025, 10:34pm UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/10 "2025-09-15T22:34:05Z")

</div>

Wow, it’s doing really good now - raspi is not struggling 😀 Will continue building on these ideas and experimenting - learning tons here - huge thanks @GoToLoop. Will make a short video soon and let you know when it’s up so you can have a look 🙂

---

<div class="post-metadata">

**Author:** ![noahhsmith](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/noahhsmith/32/21058_2.png) [@noahhsmith](https://discourse.processing.org/u/noahhsmith)\
**Post date:** [September 17, 2025, 6:23am UTC](https://discourse.processing.org/t/sketch-behaves-differently-on-macbook-and-raspi/47145/11 "2025-09-17T06:23:18Z")

</div>

Hi @GoToLoop - here’s a very rough vid - first have made! 😄 Can see the ‘refresh’ on the raspi is still pretty noticeable - can try working on that 👍 🙂[https://www.youtube.com/watch?v=OaCOeS7wz6c](https://www.youtube.com/watch?v=OaCOeS7wz6c)