Picture building a “site/portal”. Where parts of it will be more complex with an UI being a good fit for something like AngularJS, using client side rendering and routing. On the opposite side, there will be other parts of the site that are more “static”, which would manage just fine with content being rendered server-side, without AJAX-calls etc. But all of it could be made 100% with AngularJS.

Please, when done, share your opinions and thoughts using the comments below. This post is all about me seeking feedback.

When it comes to SEO, seen to the more “static” parts, it would be easier to go with server-side rendering. How-ever, it could also be done using client-side rendering and then use a service like Prerender.io to have it indexed for search engines.

Most of the “static” parts are being administrated using an “inline” administrative “tool”, built using AngularJS. So if there were to be two different solutions: one for the admin tool and one for the “public” facing parts; some layout parts might need to be duplicated, since one would render server-side and one client-side.

That’s the scene. Please, provide your thoughts and feedback. Pros and cons with e.g. using AngularJS for the “static” parts as well.

Thanks,

//Daniel

Category:
Architecture, Design, Development
Tags:

Join the conversation! 9 Comments

  1. If you’re concerned about code duplication between angular and static parts, and you’re already looking at pre rendering, which you can do yourself if you don’t want to use a service, you can also pre render for your clients, just serve the pre rendered versions if that’s appropriate. At that point, angular is just a way to edit and generate static content.

    Reply
    • Thanks! Yep, could do that. Have you done it that way or how have you solved “issues” like this? I’m kind of interested in actually “trying” it (100% client-side) to see how it works.

      Feels a bit silly that we have to put these constructs up. You be a way to instead provide meta-data for fin tuning for crawlers to know when a page is “good” for indexing, i.e. done rendering. I mean. If other frameworks can e.g. count outgoing requests etc, why can’t they?

      //Daniel

      Reply
      • I’ve not had to use static rendering myself with angular yet, but I’ve read about it. But on my own site, gillius.org, for a long time I’ve used static content generation, as it’s a blog which changes but I didn’t want to use something like PHP, which renders the same thing every time as the site changes rarely. As much as I love angular, it would be overkill.

        As for counting requests, I’m not sure what you mean but for crawlers they can use the standard techniques they’d use for static content anyway. You can update dates only for changed pages. If you want hit tracking, standard analytic techniques still apply.

  2. SEO is not the only factor. If what you’re making is more “web site” than “web app,” and you want a good, lean, performant experience, then I would advocate rendering your HTML server-side.

    Twitter famously experimented with creating a JavaScript SPA app, and they found that their metric of average time to a user reading their first tweet suffered for it. So they reverted.

    When a user navigates to a SPA, their browser has to (1) download the app, which then (2) bootstraps and makes a request (or requests) to a JSON API, and then (3) render that into HTML. Compare that with a non-AJAX web page that performs the equivalent of all those tasks in the context of a single HTTP handshake (well, there might be separate requests for CSS and images, but you get the point.)

    That up-front cost to download and bootstrap the app is amortized when it’s actually a highly interactive app. It would also be negligible on a computer with high speed internet. Where it might have a big impact, though, is on high latency mobile connections.

    So you have to ask yourself, is this an informative web page that I want to be accessible, lean, and performant for as many people as possible? Or is it more along the lines of a highly interactive app?

    Twitter walks the line between the two. Now they have it modularized so that an initial HTTP request will be served the content it asked for, already rendered. But subsequent requests to navigate through twitter will use AJAX.

    I wonder if it’s possible for you to aim for a combination, as well. I imagine one layer serving the consumer, just a normal web page rendered server-side. Then, if authenticated as an admin, you would have your JS admin app layered over it.

    Reply
    • Yes, doing a combo is something I’ve thought of and will see how it turns out. You are absolutely right that it’s not just SEO that is important, but of course the “experience” as well. The first part of the first release is rather small and isolated and it looks like it will go out full Angular style, to “learn”. It will be really easy in this case to switch for server-side generation of the “public” view.

      Just out of curiosity. Any good resource on the Twitter “findings”? Always interesting to read.

      Cheers,

      //Dan

      Reply
  3. Google just recently announced that their crawler has been rendering javascript-heavy sites and they will soon provide tools to see exactly how your site looks to the crawler.

    I think looking to the future, this will be much less of an issue and you may not have to worry about prerendering anything for search crawlers.

    Reply

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.

%d bloggers like this: