How to use github pages for optimized static website or game

Last week I have read post by Andrzej Mazur about hosting games on github pages and as this post covers things that were new to me I have recently found some nice tricks that can help with while working on these pages more effectively.

Source: Host Your HTML5 Games on GitHub Pages

Now, what I mean?

To use github pages you must create new branch on github called gh-pages so you have to options:

  1. delete master and use only gh-pages
  2. push to gh-pages from time to time but work on master

Both have it's strong and weak points.

1: Working on gh-pages alone is easier but you will struggle to add any build process so you have to use unoptimized resources in your game.

2: You maintain some kind of optimized version of a site or game in gh-pages branch and use master branch as src. Downside of this approach is that you need two folders cloned from the same repository on disk and force build script to know about external directory structure.

So are there any alternatives?

I think there is and it can be really easy to use :)

Idea is to use git subtree and have dist and src folders in master repository. The trick is to make dist folder point to gh-pages branch :)

I don't know who came up with this idea first but when I figured it out myself it was already solved by Yeoman community.

Yeoman Deployment page covers it nicely:

To make dist folder point to gh-pages use:

git add dist && git commit -m "Initial dist subtree commit"

And to deploy:

git subtree push --prefix dist origin gh-pages

Remember that dist folder will be part of master branch as well so you can't have it in .gitignore file. When using any build tool like branch that generates .min.* files you need to commit them to master branch and push to gh-pages branch. Sometimes it may not be the best option, and it feels like committing binaries but in my opinion it is useful enough to still use it.

I you are using Bitbucket there is something similar there as well: Publishing a Website on Bitbucket Cloud but there are some quirks so you must decide on your own.

Share on Hacker News
Share on LinkedIn

← Home

Want to learn more?

Sign up to get a digest of my articles and interesting links via email every month.

* indicates required

Please select all the ways you would like to hear from Krzysztof Kula:

You can unsubscribe at any time by clicking the link in the footer of my emails.

I use Mailchimp as a marketing platform. By clicking below to subscribe, you acknowledge that your information will be transferred to Mailchimp for processing. Learn more about Mailchimp's privacy practices here.