Rethinking Static Sites (kellysutton.com)
almost 6 years ago from Joel Califa, Senior Product Designer at GitHub
almost 6 years ago from Joel Califa, Senior Product Designer at GitHub
Another approach to this would be to use PJAX (https://github.com/defunkt/jquery-pjax). I'd be interested in a side-by-side comparison of the two. Being that it's just jQuery and the PJAX plugin, I'd reckon it'd be a bit faster than loading all of Ember. :-)
Having both server- and client- side rendering is the holy grail for JavaScript frameworks.
But if it's a static site, there might be easier solutions. It doesn't seem like it would be that hard to come up with a Node SSG that parses JSON files for its content and can also run in the browser, without having all the overhead of something like Ember, React,or Meteor?
A big consideration is "how much are you duplicating?"
There's a big divide between template-oriented tools and component-oriented tools.
Template-based tools are usually page focused — whether this is Rails or Jekyll or whatever — there's usually a view representing the current page, calls into partials or template helpers for items on that page, and some series of nested layouts that that page is rendered inside of.
Component-based tools focus on the composition of UI elements. Angular element directives, React components, Ember components — apps are build out of more-specific components consuming more general components atomically, until you have a page.
Traditionally the argument has been "well how much interactivity do you need?", but I think the question needs to start being "how much are your styles something you're duck-typing to from a hodgepodge of server side templating and client-side UI frameworks?"
The answer is always "it depends", but there's a lot of appeal to the self-contained component thing as a building block for web publishing, whether it's a static site or a rich app. React is especially suited to this, as a tree of React components can be rendered either to a live DOM, or as a big string.
Good read. Kelly, could you share a repo/snippet of how you have all of this working? Would be really curious to see what it takes under the hood. The benefits sound great.
Hi Ryan,
It doesn't take much more than just getting started with a vanilla Ember app, really. Everything else you get for free.
For getting started with Ember, just install ember-cli:
npm install -g ember-cli ember new my-static-site
More info here: http://emberjs.com/
Designer News
Where the design community meets.
Designer News is a large, global community of people working or interested in design and technology.
Have feedback?
Login to Comment
You'll need to log in before you can leave a comment.
LoginRegister Today
New accounts can leave comments immediately, and gain full permissions after one week.
Register now