One of my LiveView view’s has a very heavy javascript dependency so I want to avoid loading it for every page on the site, while still using live_redirect or similar between the two (avoiding a full-page load). However, I’m running into https://github.com/patrick-steele-idem/morphdom/issues/178 Th…

I was able to do it via a LiveView hook and webpack’s dynamic imports . Now, if you figure out <head> tags please let me know. I want LiveView-enabled pages but with opengraph+friends tags based on a resource loaded on mount. I don’t think I can use hooks/JS for that.

[image] Bumppoman: Any chance you might be able to load it with a hook? I kind of can but it feels overly hacky. The approach that I’ve come to that partially works is to have a LiveComponent that receives the src href as an assign. Then it creates a <script src="<%= @src %>" onload="onloadfu…

I’m using Webpack 4.43.0. I didn’t notice the docs are for v5, but the dynamic imports are certainly working for me. I’m going to open-source YouMeet when it launches, so I don’t have the full repo open to browse yet, but here are some snippets that I think covers it. Here’s an example hook to loa…

What I’ve learned is that if you are using webpack you should be able to dynamically load bundles per hook. This is how I’m currently doing it. By using this style in importing. let Hooks = { PageIndex: { mounted() { import('@mojs/core').then(mojs => {}) ... It only works if you impo…

[image] axelson: Hmm, I’m just using separate bundles but not dynamic imports. Do you have an example you could share about how that worked for you? Not sure if it’s relevant, but: Has anyone used lazy loading in a phoenix live view project? And the example repo: https://github.com/syfgkjasd…

Thanks for all the examples. I should be able to get something working with them.

Here’s the gif I tried to post earlier: https://imgur.com/a/izmruiM

That’s a cool way of using async function for hooks. Thanks for sharing that exmaple.

This is one of the two best threads that come up from search on the topic, so reviving it with an up-to-date solution for the benefit of all. Just like the OP, I wanted to use a heavy JS library in a single page without compromising the bundle size for the rest of the app. Nowadays Phoenix project…

Elixir Programming Language Forum

Is it possible to have page-specific javascript with LiveView?

Questions & Help Questions

Bumppoman June 25, 2020, 1:01am 2

Any chance you might be able to load it with a hook?