Proper way to setup a Carousel from Materialize (jQuery)

I’m trying to figure out the best way to setup a carousel (among other jQuery UI features) using Materialize CSS (jQuery). I’ve tried a few different things without what I’d call good results.

I’ve asked a similar question, but with less overall consideration, and didn’t get much of an answer.

  1. Use a setTimeout to delay the creation of the carousel. The problem I see with this, is if the page is re-rendered, I think the carousel is being reinitialized. I’m not entirely sure, subsequently, what happens to the previous instance of the carousel. The second issue I see with this, is that it doesn’t really seem to solve the problem, since the timeout doesn’t correspond to any tangable status of loading.

  2. Put a helper to load the carousel in the template and then you a susbscriptionsReady if wrapper, so once ready it creates the carousel. I couldn’t get this to work, and again I seem to wonder if it’ll get reinitialized properly with reactive data.

  3. Same as above, but in the onCreated method for the template us JS. Same issues.

I’ve been advised to put any $(…) code into onRendered. I guess I’m curious why I’d need to delay firing if onRendered is effectively the same as dom ready.

What am I missing here?