The SEO Debate - Pre-Compiled HTML and/or Node.js to the rescue?

[chrisjacob]

I noticed Mário Valente shrugged off the issue of SEO / Google Bot

http://mvalente.eu/2009/11/25/requirements-for-a-modern-web-development-framework/comment-page-1/#comment-480

However this is obviously a concern in the "real world".

Ideally what I would love to be able to do is:

1. Build my site / templates with minimal.js - during development run a page locally and have the templates dynamically generated clientside. (I'm looking to do my development in Cloud9 IDE cloud9ide.com it's "preview" option is hosted; so paths for src="" & href="" should resolve just fine e.g. src="js/minimal.js" ... if on localhost use something like MAMP if needing a basic file server).
2. When it comes to pushing this into production I would like to host on node.js and have the pages generated and cached. Flag minimal.js to not process the page on load (since this was done serverside - which sent down static HTML for Google to happily index - and for screenreaders to read). But still have minimal.js available to dynamically update the page/template - e.g. as a result of an AJAX call.

... another idea is to pre-compile the site; so all the hosted files are static HTML i.e. could even host on GitHub Pages... not sure if there is a "simple" solution to do this... but no-doubt serving static HTML files is FAST, SAFE & can be hosted on ANY server... e.g. Nanoc (http://nanoc.stoneship.org/).

[chrisjacob]

BTW - I have opened a support ticket with Cloud9 IDE to support a built in {LESS} compiler. http://cloud9ide.lighthouseapp.com/projects/67519-cloud9-ide/tickets/180

LESS: http://lesscss.org/

Perhaps a similar thing could be done with Minimal.js ...? at least in Cloud9 IDE since it's already hosted on Node.js perhaps it's a perfect fit.

In my case I could have my code hosted on Github (gh-pages branch). Clone that project into Cloud9 IDE. Edit and preview in Cloud 9 IDE. Then somehow compile. And then git commit to push my static HTML files back over the GitHub Pages for free hosting ^_^

Need to somehow switch seemlessly between compiled and not-compiled (e.g. like how LESS has style.less which is then compiled into style.css)

[ruidlopes]

Indeed, useful. But this is something that has to be built on top of minimal.js, not part of the core component. Maybe as a new render engine on Express (http://expressjs.com/) ?

[chrisjacob]

I will take a look into expressjs, however I wonder if it can somehow be framework independent?....

index.m.html - non-compiled source. index.html - post-compiled source.

If I open index.m.html minimal.js does the work client side to "build" the page on dom ready... perfect during development (like http://lesscss.org has a clientside js compiler to generate it's css on the fly).

When I'm ready to go into production I can locally call some sort of build/make on the file and it will replace index.html with the latest compiled version.

... or if I don't like compiling my files and don't need to worry about performance hits / SEO / accessibility of clientside templating then I should be able to just host an index.html with the same code that index.m.html would have.

[chrisjacob]

Re: Express View Rendering - see: http://expressjs.com/guide.html#view-rendering

[ruidlopes]

Well, I've thought a bit on this issue.

My answer is that this shouldn't be available as a core feature of the engine, but either through frameworks (such as Express) or command line tools.

I'd go first with the latter, simple to bootstrap. But an Express implementation is something I have been thinking about for a while, indeed.

[chrisjacob]

Would like to see an implementation that was independent (command line / node package). An Express solution would also be great for this project (to gain community attention) - but strays a little from the Design Goals of being "independent".

I do wonder tho how a static HTML file could be generated - where only the minimal.js tempating is executed - taking a snapshot of the compiled source - without executing other JS e.g. ajax calls etc.

Hmmm difficult & out of my league of knowledge ;-)

It would be a real game changer tho if a JS template system could pre-compile and deliver static source to the client (for Google Bots, Screenreaders, etc)... I guess that's where Express steps in. But I really want something much "simpler" that anyone can just pick up without needing to install anything extra. When they run it locally clientside JS does the build; when deploying user either pre-compiles and uploads static files (like LESS); or if deploying on a server (say running node) then minimal.js (or some independent tool) is smart enough to dynamically pre-compile (+cache?) and deliver static files.

[chrisjacob]

Raised a discussion ticket with the folk over at Cloud9 IDE.

"Idea: Supporting the Compilation of JS Templates into Static Files " http://cloud9ide.lighthouseapp.com/projects/67519-cloud9-ide/tickets/211-idea-supporting-the-compilation-of-js-templates-into-static-files

[ruidlopes]

I'll implement the command line utility soon, and already started looking at Express. More on this soon.

[chrisjacob]

Exciting ^_^

[chrisjacob]

FYI. Since I'm hosting my work on GitHub Pages http://pages.github.com/ it looks like I will be resorting to Jekyll https://github.com/mojombo/jekyll/ for my templates. GitHub auto-generates the static HTML when you push to GitHub Pages - which should work out rather well. Only trouble is previewing my work before pushing it to GitHub (i.e. browser won't understand Jekyll/Liquid tags so pages are no longer "standalone").

P.S Jekyll uses Liquid tags - https://github.com/tobi/liquid/wiki/liquid-for-designers

P.P.S Still very interested to see if a JavaScript templating system could do the triple threat - Clientside and/or Pre-Compiled and/or Serverside... ^_^