Page speed - Loading comments on an article/blog post

Question

So I'm currently building a template page to use for articles that we will be purchasing from a content writer (so basically we are content marketing). I'm finishing up the layout on the comment section and I implemented a little system where the page only renders 3 comments and displays the rest if the user pushes a button, called "view more comments".

As far as page speed goes, what's the best approach to loading up the comments without affecting the loading time much? I plan on using a PHP script to query a MySQL database to pull out the comments for a requested article. From there I can either have the script run directly from the template and load the comments as an array (associative or multidimensional), or I can instead use AJAX and bring them out in the response as a JSON object. Not sure if I should load up all comments at once or in sets of 3 or 4, etc. So let me know what's best in terms of speed and not interfering with loading times, or if such issue even matters.

Answer 1

If you want to program your own comment system, you could, as you already mentioned, build it either 100% server-side (PHP, MySQL) and echo the data array with a foreach-loop in the template OR use a combination of front-end (JavaScript) and back-end (PHP, MySQL) technologies in the form of AJAX to avoid page reloads if fresh data has to be displayed.

From a user experience viewpoint, an AJAX solution would be nicer and loading 3-4 additional comments is a valid use case scenario where AJAX can make sense. But you should also consider users, probably not many, who might have JavaScript disabled in their browser. From a performance perspective, it depends on the number of HTTP requests that have to be executed in order to display your HTML. In order to achieve good performance levels, HTTP-requests should be minimized as much as possible. A single HTTP-request is simply faster than 5, 6 or more requests in the case of AJAX to constantly provide fresh content. Hence, a solution where HTML is PHP-generated and only served on page load, would probably be faster, but that also depends on your server specification etc.

If you want to go the way of less resistance, you could also use a pre-built solution like it is applied by many large news sites:

Disqus is probably the most popular discussion / comment hosting service around the interwebs nowadays, which has the advantage of facilitating your life as a developer due to its easy implementation on nearly any platform, direct integration of social media sharing and moderation tools. The Disqus plugin uses JavaScript. As the comments, however, will not be directly hosted on your own server, there is a noticeable delay on large sites with many comments. If data privacy is an issue and you want to self-host your comments, you could also give Juvia a try.