jekyll-perf is a static site generating framework that is focused on web performance and makes it easy to deploy a site to be hosted on Amazon S3.
Build your site
- Download jekyll-perf
- Install framework dependencies if you haven't before
- Configure options
- Command line usage:
Development mode, continually regenerates site files
Build and serve on local machine
Build and deploy to production
Specify SSH login
thor deploy -l=[SSH USER]
List all commands available
Show help for one task
thor help [TASK]
Create file '.ruby-version' in root directory, paste in ruby version (Currently ruby-2.0.0-p247)
Create file '.ruby-gemset' in root directory. Enter name of desired gemset.
'cd' into the root directory to create gemset
Run 'bundle install --gemfile=_Gemfile' to install the gems
CSS compression and JS compilation don't happen in dev mode in order to more easily debug
Jekyll layouts only have one area where you can place content. If you've ever wanted to place content in multiple places, use the new Liquid tag available in the contentblocks gem.
Static asset versioning
All images, videos, CSS, and JS files are renamed based on the contents of their files. That means the browser can be told to cache these assets indefinitely. If there are changes to the assets a new filename will be used.
Compression and minification for CSS, JS, and HTML
Deployment for staging and production environments
Separate environments are already set up in the
_build.thor file allowing you to deploy updates to either place by running
thor deploy:staging or
Low resolution image creation
If you want to support high resolution displays, place images at twice the size in a 2x folder, run
thor build:resize_2x_images and low resolution images will be created automatically.
Image optimization (PNG and JPEG)
Reduce the size of your images safely by running
Automatic sprite generation
Create sprites that are perfect to use with Sass functions: vertically oriented with a fixed grid. All images are left and top aligned in the grid. See the
_build.thor file for how to configure.
Jekyll pages built with JSON
Liquid tag to extract information from JSON files
Reference data in other JSON pages by using the
json Liquid tag. See the documentation in _plugins/json_tag.rb for usage.
Dynamic site navigation
Primary and secondary navigation can be generated automatically based on YAML metadata on the page. Use
navorder to specify placement of page within the navigation. See the default layout for an example of how to generate the navigation.
Amazon S3 deployment
If you're hosting your site on Amazon S3, all the appropriate headers for caching and gzip support in order to get the best performance are taken care of.
Building With Vagrant
- install vagrant (tested with 1.6.3)
Vagrantfileand set the ports to unused ones on the host machine
- currently 3000 (jekyll-perf default) and 4000 (jekyll default) are mapped to 3001 and 4001 respectively
config.vm.network "forwarded_port", guest: 3000, host: 3001
config.vm.network "forwarded_port", guest: 4000, host: 4001
- start VM, (will download base virtual machine, if necessary):
- connect to VM via SSH:
- change to vagrant path which maps back to folder on host:
- run normal jekyll-perf commands, like:
- open up browser and point to http://localhost:3001/ (or the corresponding port you set above)