# \[Need Advice\]: Loading resources by a node

**URL:** <https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176>\
**Category:** Developing Nodes\
**Created:** [26 September 2025 14:28 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176 "2025-09-26T14:28:59Z")\
**Posts on this page:** 16\
**Page:** 1

<div class="post-metadata">

**Author:** ![GogoVega](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gogovega/32/71313_2.png) [@GogoVega](https://discourse.nodered.org/u/GogoVega)\
**Post date:** [26 September 2025 14:28 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/1 "2025-09-26T14:28:59Z")

</div>

Hi all,

I'm having a small issue with my nodes and would like your advice.

To avoid duplicating my code, I've separated some logic into two resources, and I'd like my nodes to load these resource before building themselves.

The first node to register loads both resources and everything is fine. But when the second node registers, it fails because the variable doesn't exist. Same with the third node.

Do you have any advices?

- Resources

```js
// The first one:
var FirestoreUI = FirestoreUI || (function () {
...
})();

// The second one:
var FirestoreQueryConstraintsContainer = FirestoreQueryConstraintsContainer || (function () {
... 
// use FirestoreUI
})();

```

- First Node

```html
<script type="text/javascript" src="resources/@gogovega/node-red-contrib-cloud-firestore/common.js"></script>
<script type="text/javascript" src="resources/@gogovega/node-red-contrib-cloud-firestore/constraints.js"></script>

<script type="text/javascript">
//Use FirestoreUI
...
</script>

```

- Second and Third Node

```html
<script type="text/javascript">
//Use FirestoreUI and FirestoreQueryConstraintsContainer 
...
</script>

```

- Browser Console

```txt
ReferenceError: Can't find variable: FirestoreQueryConstraintsContainer
ReferenceError: Can't find variable: FirestoreQueryConstraintsContainer

```

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [26 September 2025 15:36 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/2 "2025-09-26T15:36:11Z")

</div>

> [@GogoVega](#):
>
> First Node

> [@GogoVega](#):
>
> Second and Third Node

Are these separate files?

If yes, do you add the resource script tag in all of the separate files?

---

<div class="post-metadata">

**Author:** ![GogoVega](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gogovega/32/71313_2.png) [@GogoVega](https://discourse.nodered.org/u/GogoVega)\
**Post date:** [26 September 2025 15:44 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/3 "2025-09-26T15:44:14Z")

</div>

> [@Steve-Mcl](#):
>
> Are these separate files?

Yes, three files

> [@Steve-Mcl](#):
>
> If yes, do you add the resource script tag in all of the separate files?

No, global variable should exist. The current version of my nodes declare these resource tags on each node file and it's work. But I think that the editor downloads the resources several times.

---

<div class="post-metadata">

**Author:** ![AllanOricil](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/allanoricil/32/106911_2.png) [@AllanOricil](https://discourse.nodered.org/u/AllanOricil)\
**Post date:** [26 September 2025 15:45 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/4 "2025-09-26T15:45:56Z")

</div>

> [@GogoVega](#):
>
> Yes, three files

@GogoVega load your client script tags in a single html file and use `defer` to garantee execution order.

You can try keeping in separate files but you have to check if Node-RED guarantee idempotency when adding your node's html in the editor.

That is why you need `nrg` v3!

---

<div class="post-metadata">

**Author:** ![GogoVega](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gogovega/32/71313_2.png) [@GogoVega](https://discourse.nodered.org/u/GogoVega)\
**Post date:** [26 September 2025 15:51 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/5 "2025-09-26T15:51:27Z")

</div>

> [@AllanOricil](#):
>
> put you client js

You mean the definition of the three nodes?

Yeah, It's a possibility. Initially, I didn't do it to maintain a certain readability.

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [26 September 2025 15:51 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/6 "2025-09-26T15:51:56Z")

</div>

> [@GogoVega](#):
>
> But I think that the editor downloads the resources several times.

No/yes. the browser takes care of that with its cache mechanism. The only time to really be concerned is if it runs some iife code. Otherwise, all good.

---

<div class="post-metadata">

**Author:** ![AllanOricil](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/allanoricil/32/106911_2.png) [@AllanOricil](https://discourse.nodered.org/u/AllanOricil)\
**Post date:** [26 September 2025 15:52 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/7 "2025-09-26T15:52:11Z")

</div>

> [@GogoVega](#):
>
> You mean the definition of the three nodes?

The script tags. Put them all in the same html file in order. And dont forget to add `defer`

---

<div class="post-metadata">

**Author:** ![GogoVega](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gogovega/32/71313_2.png) [@GogoVega](https://discourse.nodered.org/u/GogoVega)\
**Post date:** [26 September 2025 15:56 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/8 "2025-09-26T15:56:49Z")

</div>

Ok thanks a lot guys, I thought this was the wrong approach but... I'll leave it like this then.

I'll see for another day how I can build everything and put it in one file. (keeping the GH files separate)

---

<div class="post-metadata">

**Author:** ![AllanOricil](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/allanoricil/32/106911_2.png) [@AllanOricil](https://discourse.nodered.org/u/AllanOricil)\
**Post date:** [26 September 2025 16:11 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/9 "2025-09-26T16:11:53Z")

</div>

If you look how vite/rollup do in framework like nuxt, you will see that having a single entrypoint html is the right way because they have to garantee the order js is executed to avoid reference errors like you have. They output an index.html with script tags in order, loaded in parallel, but executed in order using `defer`

---

<div class="post-metadata">

**Author:** ![Steve-Mcl](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/steve-mcl/32/4826_2.png) [@Steve-Mcl](https://discourse.nodered.org/u/Steve-Mcl)\
**Post date:** [26 September 2025 16:13 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/10 "2025-09-26T16:13:26Z")

</div>

But that means a build step and ton of crap dev deps (yuk)  
For large projects, fine, but for simple node sets, no thank you.

EDIT:

Just to note, @AllanOricil I feel I should say, I am not knocking the great work you have done in support of the community

---

<div class="post-metadata">

**Author:** ![AllanOricil](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/allanoricil/32/106911_2.png) [@AllanOricil](https://discourse.nodered.org/u/AllanOricil)\
**Post date:** [26 September 2025 16:19 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/11 "2025-09-26T16:19:59Z")

</div>

You can configure common dependencies as external and add script tags from cdn. You can also bundle common dependencies in a single file and add it at the top of your .html. The second isnt good because it would take longer for the browser to download the file. We usually set chunking size using empirical values to reduce app loading time.

The best practices to make apps to load faster in the browser are:

- chunking
- minification
- tree shaking

And you can't do any without a good bundler.

The same best practices apply for node-red because it serves a client app. However nobody cares about it YET! The more nodes you install that doesn't account for optmization in the client, the longer the browser will take to load all plugins and nodes.

---

<div class="post-metadata">

**Author:** ![AllanOricil](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/allanoricil/32/106911_2.png) [@AllanOricil](https://discourse.nodered.org/u/AllanOricil)\
**Post date:** [26 September 2025 16:24 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/12 "2025-09-26T16:24:00Z")

</div>

> [@Steve-Mcl](#):
>
> Just to note, @AllanOricil I feel I should say, I am not knocking the great work you have done in support of the community

I know. All good 👍

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [6 October 2025 14:51 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/13 "2025-10-06T14:51:51Z")

</div>

You might want to look at how uibuilder does things.

It uses 2 approaches for runtime and 1 for the Editor.

The runtime approaches are:

1. A set of common libraries that are implemented as classes that self instance. So whichever node first references them causes them to instantiate and be ready for any other node.
2. A runtime plugin - these run before nodes and so can make common things available before your nodes.

For the editor, I use an Editor plugin which loads common features before the nodes.

---

<div class="post-metadata">

**Author:** ![GogoVega](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/gogovega/32/71313_2.png) [@GogoVega](https://discourse.nodered.org/u/GogoVega)\
**Post date:** [8 October 2025 08:55 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/14 "2025-10-08T08:55:58Z")

</div>

Thanks Julian 😉

> [@TotallyInformation](#):
>
> For the editor, I use an Editor plugin which loads common features before the nodes.

The problem is that if your module is installed from the Palette Manager, your plugins will not be loaded without a refresh. PR submitted.

Therefore, I was also looking to load my resources from the first node loaded, to get around this problem.

---

<div class="post-metadata">

**Author:** ![TotallyInformation](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/totallyinformation/32/31_2.png) [@TotallyInformation](https://discourse.nodered.org/u/TotallyInformation)\
**Post date:** [8 October 2025 13:48 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/15 "2025-10-08T13:48:10Z")

</div>

> [@GogoVega](#):
>
> The problem is that if your module is installed from the Palette Manager, your plugins will not be loaded without a refresh. PR submitted.

Ah, I could never work that out.

> [@GogoVega](#):
>
> Therefore, I was also looking to load my resources from the first node loaded, to get around this problem.

Before plugins were really a thing, I used the singleton class instance process and that has worked well for many years now. Because of the way that node.js works, the first `require()` of a library that is implemented that way loads and executes the code which instantiates the class instance. You can then require it from any other node in your module and it will always use that single instance. So it doesn't matter which node goes first.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [22 October 2025 13:48 UTC](https://discourse.nodered.org/t/need-advice-loading-resources-by-a-node/99176/16 "2025-10-22T13:48:14Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.