Hi! I’m John Fonte, a Software Engineer at accesso. I build custom websites like Hybrid and M-Fly.


How to build a stable site with a JavaScript server

It’s an easy assumption that using a language like JavaScript for a server only applies to applications that need fast computation. However, I find there are a few benefits beyond speed that help with building simple informational sites. Here’s a quick rundown on how I use includes, templating, and caching to speed up development, maintainability, and page load times with Node.js.


When I use includes in a Node.js project, I create a “boilerplate” layout which applies to all pages on the site. I use the ejs-locals plugin. Here’s an example:

<!DOCTYPE html>
<html lang="en" class="bg-home <%=page%>">
    <title>WebSite Name | <%=pageName%></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href='img/favicon.ico'/>
    <link rel='stylesheet' href='css/main.css' />
    <link rel='stylesheet' href='//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css' />

    <div class="container">
      <div class="tabs">
        <div class="logo"></div>
        <div class="right">
          <a class="tab <%-(page == '')? 'active':'' -%>" href="/">HOME</a>
          <a class="tab <%-(page == 'page2')? 'active':'' -%>" href="/page2">PAGE 2</a>
      <div class="content">
        <%-body -%>
      <div class="footer">
        <a href="mailto:info@example.org"><i class="fa fa-envelope"></i> info@example.org</a>

Each label enclosed by <%- -%> tags describes another resource. This sets up a nice flow for the entire site, without having to repeatedly update the structure each time a minor detail needs changing.


Templates build off of includes by defining which resources are replaced. For example, if a certain page requires JavaScript resources, you can list them all without including them across the entire site. Make sure to set up your view options in app.js:

self.initializeServer = function() {
        self.app = express();
        self.app.engine('ejs', require('ejs-locals'));
        self.app.set('view engine', 'ejs');
        self.app.set('view options', { layout: "boilerplate" });
        self.app.set('views', __dirname + '/templates');
        self.app.use(express.favicon( __dirname + '/favicon.ico'));
        self.app.use(express.static(path.join(__dirname, 'public')));
        self.app.get('/*', self.get_routes['/*']);


Another way to speed up page load times is to pre-load the templated pages into memory. As another example, I’ve used Jade as my markup language, and I call Jade.compile on each page before the app fully starts. This way, the client doesn’t wait for the template, it just gets the response.

var navigation = [
  { url: "/*", uri: "home", title: "Home Page" }

var templates = [];

var getTemplate = function (filename) {
  var template = fs.readFileSync(__dirname + '/views/' + filename + '.jade', 'utf8');
  return jade.compile(template, {filename: __dirname + '/views/' + filename + '.jade', pretty: true});

for(var i=0; i<navigation.length; i++) {
  templates[i] = getTemplate(navigation[i].uri);

var render = function(req, res, index) {
  res.send(templates[index]({title: navigation[index].title}));

Then, I define each route with the template that it will return.


Using includes, templating, or caching come with their own downsides. If you have to learn a templating framework, this is a time cost you should consider. Using includes doesn’t make sense if your website is only one page. Allowing pages to be cached in memory wouldn’t provide much benefit if the templates are quick to compile. Overall though, if you’re creating a simple website, try making it even easier to maintain with these methods.

blog comments powered by Disqus