Reputation: 57
I'm working on a basic blogging platform with mongoose, node, express, Jade, and bootstrap. When I initially load a post, I can make my database calls right in that endpoint and populate my Jade view with the post content and my comments, or I can pull those down from a restful api once the view loads on the frontend. I still need an api for posting comments and articles, and I feel like I'm mixing concerns when I have a bunch of database operations taking place on the same objects at different endpoints. However, if I pull everything down with ajax I'm also doing some gnarly stuff on the frontend to create a bunch of dom elements to structure each comment instead of using neater and cleaner Jade templates. I can make either way work, but I'm trying to figure out what would be considered a best practice.
Would it make sense to call the api endpoint from within the endpoint that generates serves the Jade view? Is that a thing? Or is there an elegant way to generate a bunch of nested dom elements on the client? I've tried using a bunch of document.createElement and appendChild calls, which works, but looks ridiculous and handing a string of html tags to jquery, but my understanding is that jquery uses innerHTML under the hood to create the elements which is less than ideal.
I'm not quite sure if anyone would like to see code snippets or which ones you might need, but give me a hollar and I'll post them if you like.
Thanks!
[edit for clarity]
Upvotes: 0
Views: 194
Reputation: 323
From a performance and scalability point of view, less trips to the server from the client is always better. I always send as much data down in my Jade templates as possible and only use additional ajax calls for expanding the initial view that was supplied to the client ... things like 'more comments' for example when the number of comments on a post is substantial or dynamically scrolling through pages of blog posts in a mobile view.
Also, you'll do much better with Search Engine Optimization (SEO) if the majority of the data on the page is populated with an HTTP request instead of ajax calls, unless you're going to get into using a 3rd party or home spun method to cache pre rendered pages.
Upvotes: 1