Enabling progressive loading of index page content #3485
Conversation
There was a problem hiding this comment.
Open questions: if we go with this approach, do we want to make the page_size value a field on the IndexPage, so that we can control the batch size through the CMS? It feels like we probably do, but always good to hear opinions.
🗣 Yes—I fully support this! But in reference to what Mavis said 👉 #3485 (comment), we should give them predetermined batch sizes in the CMS to choose from (e.g. at desktop being able to choose between 3, 6, and 9) instead of letting the editor choose a number. If that's what you were already thinking, then ditto!
Pomax
changed the title
Pomax
force-pushed
the
using-route-instead
branch
from
c82a94d
to
0d57f46
Compare
|
Load more is working great except for when there are several posts. In this PR the text says
Screen cap from PR: |
There was a problem hiding this comment.
Should tags with a space show a hyphen in the pill capsule [not sure what to call this]? I also left a comment/question about the counter getting updated. Otherwise, this is looking great @Pomax 😺
sidenote: This can be done as follow-up, but is there any way that when load more results is clicked, the entries' text & image loads at the same time or is that a weird ask? I'm just curious of what could be causing the image load delay...or maybe there's just a delay on my end. Let me know if you see it too.
|
That's a good question. @kristinashu I assume it's desirable to have the "filter" tag use the same casing and spacing as in the result card? |
|
@youriwims the delay is caused by the fact that pressing the button starts the API call, so we'd have to pre-call the next set if we want "instant" results. If that's something we want to do, we should probably do that in follow-up. |
Ah okay, makes complete sense. |
Yes, that would be great. Thank you for pointig that out @youriwims! |
|
@youriwims @kristinashu PR updated with fixes for the flagged issues |
There was a problem hiding this comment.
🌟 🌟 🌟
Totally not a blocker: Something feels odd ux-wise about having a Load More, but the total count of entries available prior to all of the entries being visible. I think it's because when I've usually seen this type of feature it's displayed as 'Page x of y' and then includes a total count of entries...just a random thought 🤔 💭
|
@youriwims after talking with @kristinashu about what the label should convey (I had the same X of Y idea), we decided to keep the label as simple as possible and just have it say how many results there are total, rather than how many you're looking at right now and then updating that as you click the "load more" button. This might of course be revisited once we have tons of posts, but at our present volume (and a default page set of 12, rather than the custom 4 for the review app) we're unlikely to run into things feeling weird for a while to come =) |
|
@youriwims I don't think it is that unusual to do it this way. The functionality you mentioned might be more common for paginated pages (example: page 3 of 12) but not necessarily as common for the "view more" type of loading where content load below. And sites that use lazy load (example: Medium) don't even show a total number at all. Here are the first few sites that I like which use the "load more" style and only show the total number of results: https://thewirecutter.com/search/?s=canada |
|
Thanks for explaining @Pomax & @kristinashu (and for the examples!) 😄 |
Closes #3443
This PR adds in a "load more results" button to the
IndexPagetemplate, with code hooked up inmain.jsto make that an active button that fetches paged entry sets from the index page for progressively loading the backlog of entries.test
details
the index page for blog has been set to a "page size" of 4 in the CMS (this is a per-index-page setting that defaults to 12 results per page if left untouched). Currently possible page sizes are 4, 8, 12 (which is probably best), and 24