Keep things in memory vs querySelector

Hello everyone!

I am developing a JavaScript class for a Web app and I would like to ask you for a best practice advice.

There are some images inside a container with id ‘#carousel’.

The script will access a lot of times the child images of the carousel in different JavaScript methods.

Instead of performing a ‘document.querySelector(‘#carousel’).children’ in each of those methods, I decided to perform only one query in the class constructor to keep all the children of ‘#carousel’ in memory. I did something like this:

[code]
function App()
{
let items = document.querySelector(‘#carousel’).items;

function showSlide(slideNumber)
{
items[slideNumber].classList.add(‘show-slide’);
}
}
[/code]

Do you think that keeping all the children images of ‘#carousel’ in memory is a good approach?

Or do you think it would be more efficient to perform a query selector in each method to ask for the carousel images?

Thank you so much!

Also in #JavaScript _↴