The Grid - Load and scroll Performance on mobile

Any suggestions on optimizing the load performance of Post Grids from The Grid plugin? On the web page referenced below, I have a grid where I’m pre-loading close to 400 podcast posts with a 0ms preloader item display. I like the preloader option because I can show the visitor a loading icon and once it disappears, I’m confident all podcasts will be there for them to filter and do a keyword search on. While this is performing pretty well on desktop, it is excruciatingly slow on mobile devices (even on wifi).

Can you guys or gals try to pull this page up on desktop and then on mobile to see what you experience? https://zenparentingradio.com/podcast-directory/ (Note: I’m using chrome browser on an iphone 6s) .

My experience: On mobile, the loading graphic doesn’t show and then once the posts load, you can’t scroll up or down right away. Once you are able to scroll, it is very very slow. It is basically unusable on mobile. Any recommendations?

Thanks!

Hello,

I think that 400 items are too much load in the same page - because the internet speed will interfere in the load process. So, I recommend you to add a limit per page and show a minor number like 30, 20 instead 400. Check how to accomplish it here: https://theme.co/apex/forum/t/extension-the-grid/74

Thanks for the quick response, John. I had it designed this way originally—only showing 30 posts at a time and using Load more/pagination. The problem with this design is it renders the filtering & keyword search essentially useless because it only searches & filters against what is loaded. It’s a poor experience if a visitor lands on the podcast blog directory, then immediately searches but nothing comes up even though there are plenty of blog posts in the directory that contain those keywords. Any suggestions?

Thanks!
Brad

Hi Brad,

You can try installing a cache plugin.

For more information kindly refer to the link below

Hope that helps