I have a site that includes lists of 25 items, each one of which has its own comments block, and each comment can be linked to directly, in which case the page is loaded, scrolled to that comment.

Previously, the comments worked as follows: we'd show first comment, a "show more", then the two most recent comments. Show more would expand all of the intervening comments. If someone linked directly to a comment that would be hidden, we loaded the page with that comment block expanded.

The problem with this system was that popular items could end up with thousands of comments, and page loads would time out or run out of memory.

We replaced the old comment system with paged comment blocks, 5 comments per page, paging in place on the list page. If someone jumped to a comment in the middle, we'd load with that comment showing. Otherwise, we load the last page, with the most recent comments, for each item, which may have 1-5 comments.

This solves the problem with page loads crashing, but it is not popular with the users who were used to being able to see all comments at once, without paging. Is there a better pattern for handling showing/paging of comment streams?

EDIT: I should have mentioned this previously: comments often reply to one another, so the sequence of comments is important. We don't currently store threading data, so ordering by top comment would cause issues with following conversations.

2 Answers 2


Paging in general is the best way to go and additional content should be loaded as needed. However, when it comes to comments, you can often have problems that are a result of improper ordering and you've mentioned a few.

The best way to go about ordering and scaling comments is by assigning a popularity to the comment made. The popularity could be the number of replies to the comment, the amount of up votes to a comment or any other similar mechanism.

Once you have a score for the comments, when pulling it from the database you should be able to pull the comments in the right order based on popularity. You could also add an option to order by most recent.

As for loading I would suggest you employ an infinite load. You should automatically load more comments as the user scrolls down to save them from clicking "Next Page" or whatever you have setup. Ensure you add a limit to that, something like after the 5th page force the user to click "Load More" so that they can load up to 5 more pages.

  • Yep, Incremental loading is definitely the way to go here.
    – Franchesca
    May 8, 2014 at 8:43
  • Unfortunately, ordering by popularity won't work for us, at least not how the comments are structured now. The reason for this is that comments often reply to one another, as sequential conversations, but there is no threading recorded in the database. Infinite load could work, but how does that work when a user jumps to a comment in the middle of a large block of comments? do I just show the comments in the middle, with load more links at the top and the bottom?
    – Karptonite
    May 8, 2014 at 12:52
  • For infinite scrolling once you determine the proper location you can either load everything up to that point and scroll the user to that part or you load and display that part while displaying a button above that comment that states "View all comments". May 8, 2014 at 13:17
  • As for popularity. This is something all major sites do as it shows the relevant comments at the top while moving the low quality ones towards the bottom. You may not need to order the replies to comments, but you can order the parent of the thread. As you record new comments on the parent, you can easily just increment a row called score for popularity. Anyhow, that was just a suggestion :) May 8, 2014 at 13:19

Consider the purpose of those comments.

It is either a way for a user to ensure validity of the rating or to find additional information (pros/cons of the item).

In both ways, rating and 3 top comments would be totally enough to shift decision scale of a user to one or another item.

Displaying additional comments should require certain user initiation, say, hovering mouse over the item, just because of typical user cognitive limits.

Also it would be reasonable to scale number of comments with layout of items positioning, for example, if you have 2 display modes, item-per-row and iterm-per-cell (table layout):

  1. When user choose item-per-row it means he is 'meticulous' type and interested in top 10 comments. So you have space for those comments and user want them - it looks right to show them.

  2. When user choose item-per-cell - it means user want quickly overview all items. He may need minimal item feedback, rating and maybe 1-3 top comments (in some cases it would be advisable to not show comments at all).

  • As I mentioned in the comment on the other response, comments often reply to one another, and we don't record threading information (all comments are added to the base item), so reordering by popularity would be confusing.
    – Karptonite
    May 8, 2014 at 12:54
  • So you have nested comments? What is purpose of showing those discussions to the users (consider the fact it is parrallel discussions on variety of 25 topics)?
    – setec
    May 8, 2014 at 13:05
  • No, they are not nests. Rather, users carry on sequential discussions in a flat comments. And while there are 25 topics, they tend to be related topics. We show them to the user because the discussions in the comments are, in some cases, a primary purpose of the list. For example boardgamegeek.com/geeklist/173234/…
    – Karptonite
    May 8, 2014 at 16:21
  • Thanks for the link, it's now more clear. This is natural place to use built-in infinite scroll sections for those comments, placed right to the icon/description of the item. Check this link for example of the infinite scroll: angular-ui.github.io/ui-utils , section "Scroll till you drop".
    – setec
    May 9, 2014 at 13:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.