Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Assets not loading with twig cache enabled #1

Closed
filippomasoni opened this issue Apr 19, 2021 · 7 comments
Closed

Assets not loading with twig cache enabled #1

filippomasoni opened this issue Apr 19, 2021 · 7 comments
Assignees
Labels
question Further information is requested wontfix This will not be worked on

Comments

@filippomasoni
Copy link

It works perfectly with cache disables or with “never cache twig” enabled on the gallery modular page, otherwise at the second refresh photoswipe css and js are not loaded anymore.

I’m on the latest stable Grav version with admin and other plugins.
I’m including css and js from the base theme like this:

{% block stylesheets %}
    {% do assets.addCss('theme://dist/css/main.min.css?v=1.0.1', 102) %}
    {% do assets.addCss('theme://dist/css/main.css.min.map?v=1.0.1', 101) %}
{% endblock %}

{% block javascripts %}
    {# {% do assets.addJs('jquery', 103) %} #}
    {% do assets.addJs('bootstrap', 102) %}
{% endblock %}

{% block assets deferred %}
    {{ assets.css()|raw }}
    {{ assets.js()|raw }}
{% endblock %}

I tried on a different Grav install (v1.7.10) as well and it’s doing the same.

@Karmalakas Karmalakas self-assigned this Apr 19, 2021
@Karmalakas Karmalakas added the bug Something isn't working label Apr 19, 2021
@Karmalakas
Copy link
Owner

Hi, @filippomasoni
I finally got to work on the issue, but it seems I can't reproduce it. No matter if I clear the cache or reload the page multiple times, it always loads both CSS and JS

Do you have at the bottom of your base template (before </body>) this? Because the init() JS is placed there (in the bottom block)

{{ assets.js('bottom')|raw }}

Here's my page config:
image

And global caching config:
image

@Karmalakas Karmalakas added the question Further information is requested label Jun 8, 2021
@filippomasoni
Copy link
Author

Hi, sorry for the delay, I'm now getting back to work on web dev after I finished my last project.

I have
{% block bottom %}
{{ assets.js('bottom')|raw }}
{% endblock %}

before so that's ok.

On a page level I have the following:
Screenshot 2021-06-22 124027

I had to enable Never cache twig on the modular page containing the gallery to make it work.

On global caching I have everything the same except: Clear image cache by default, enabled because that's the default in Grav. Not sure if that's the issue.

I'm going to update some of my sites and star working on something new in the next few days so I'll have more time for testing. I'll let you know if I find something new.

@Karmalakas
Copy link
Owner

Hmm... I suspect this might be related to how modular pages are cached. I tested on a non-modular page 🤔
I recall some kind of discussion related to modular page caching, will have to search for it

@Karmalakas
Copy link
Owner

Can reproduce in modular page

@Karmalakas
Copy link
Owner

Asked some questions and searched a bit and found this old comment from the Grav developer himself and it kinda makes sense.

Just checked and never_cache_twig: true on that specific module page does help.

So basically what happens with modular, as I understand it, all modules are merged and cached as one modular page and next time it renders, Twig extension which renders Photoswipe is never called. Disabling Twig cache makes it render after the content is cached and that makes assets render.

Sorry, but it's a Won't fix from where I stand 🙂
Hope you understand and enjoy my plugin otherwise 🙂

@Karmalakas Karmalakas added wontfix This will not be worked on and removed bug Something isn't working labels Jun 22, 2021
@Karmalakas
Copy link
Owner

BTW, you could move {{ photoswipe('your-element-id', 'a') }} from the module template to the main modular page template. Just tested and that works, but I see the issue here if you want to use multiple galleries on multiple modules on same modular - you'd need different element IDs for each of them

@filippomasoni
Copy link
Author

Thank you for actually putting the time in and researching the problem.

I actually find that old comment from the Grav dev very important as it explains the best way to handle things like this maintaining maximum cache performance possible. I'm glad that's exactly what I previously did without knowing the details, I just did some trial and error.

I'm glad we now understand why it happens and hopefully will be helpful to others.

I do actually want to have multiple galleries on my modular page and I have my gallery.html.twig template including photoswipe and giving it a dynamic ID based on the page folder name. I've done the same before with another gallery plugin.

At this point, I think the best solution for people that want to use photoswipe on modular pages, is to have a default never_cache_twig: true on the blueprint of the template. You could suggest that on the documentation. I'm gonna set that up now, I was just waiting if there was a different fix.

Thank you again and have a great day

hughbris added a commit to hughbris/grav-plugin-photoswipe that referenced this issue Jun 28, 2023
Karmalakas pushed a commit that referenced this issue Jun 30, 2023
* Add caution note about invoking photoswipe in a modular template with caching; ref #3, #1
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
question Further information is requested wontfix This will not be worked on
Projects
None yet
Development

No branches or pull requests

2 participants