Public Forums 71,145 posts

[tripslip38 Friend tripslip38Join date: March 2010Posts: 22Downloads:0Uploads:0 Thanked: 2 times in 1 posts]

#184718

I’m wondering if it’s possible to prevent modules from loading conditionally based on responsive layout?

For instance, I have a pretty beefy slideshow that leads my layout and looks great on desktop, but on a smartphone it’s just not a good experience. I can use the responsive states pre-defined by Bootstrap to set that position to display:none for small screens, but will that actually relieve the client of any pre-loading of assets like large images?

I guess this is more of a “best practice” question on how to optimize the load. I don’t think it’s possible to base module loading conditionally with media queries, so CSS display is about all there is.

[Wall Crasher Developer Wall CrasherJoin date: December 2011Posts: 1113Downloads:0Uploads:15 Thanks: 66 Thanked: 361 times in 300 posts]

#483170

Hi tripslip38,

I am sure that any developer will think about this when create a responsive website.
There may be some solutions but seems no real solution for this yet.

You can take a look at
http://24ways.org/2011/adaptive-images-for-responsive-designs-again/

I wonder if next gen of HTML and CSS that will solved this issue. :laugh:

Regards

[tripslip38 Friend tripslip38Join date: March 2010Posts: 22Downloads:0Uploads:0 Thanked: 2 times in 1 posts]

#483262

<em>@Wall Crasher 359761 wrote:</em><blockquote>Hi tripslip38,

I am sure that any developer will think about this when create a responsive website.
There may be some solutions but seems no real solution for this yet.

You can take a look at
http://24ways.org/2011/adaptive-images-for-responsive-designs-again/

I wonder if next gen of HTML and CSS that will solved this issue. :laugh:

Regards</blockquote>

The complexities of involving the server side application are definitely there. I had thought about this issue more today when thinking about how to reshape my Google ads to fit the various responsive layouts. I’ve tried to use the core Joomla banner component, and will have to look into a way to change the Adsense ad format depending on screen size parameters. Otherwise, I’d have to load multiple banner modules, each containing a different size ad format, then hide/show them depending on screen width with media queries. That seems like a lot of unnecessary overhead.

Currently I’m just hiding my slideshow with CSS when the screen gets narrow enough. I’ll have to tweak the JS to prevent those images from preloading. It seems like it would be easy enough for Joomla to consider screensize as an input parameter on load and conditionally load modules. Maybe that’s more of Joomla than T3 issue.

[Wall Crasher Developer Wall CrasherJoin date: December 2011Posts: 1113Downloads:0Uploads:15 Thanks: 66 Thanked: 361 times in 300 posts]

#483357

Yeah, but though there are many devices and screensize out there.
Some of theme have landscape size much different from portrait size. It will make the loading image more complex.
And… even if we consider store all images in different size, it will cost much storage for server.
I think the most smartphone nowaday much powerful and they will handle those image size easy. :laugh:

[Author]

Posts