Trio Icon
Trio v5.0.0

The Trio Blog

  1. Latest
  2. Releases
  3. News
  4. Tutorials

Next Feature Release

What's coming in the next release

I am very pleased to announce that the next release of Trio will add a new feature to its toolchain, support for both ES6 and CommonJS browser run-time JavaScript modules.

Support for JavaScript bundling will be provided by two scripted reference implementations, one for Browserify and CommonJS, and one for Rollup and ES6.

Both Browserify and Rollup were explicitly chosen because both are succinct implementations that limit their scope to only JavaScript bundling.

You can chose to use either reference implementation as is, or you can expand upon them to tailor them exactly to your project's requirements.

If you would prefer to use a library other than Browserify and Rollup then you can provide your own scripted implementation for the library of your choice.

What's changing in the next release

Before Trio was even a project, the ability to cache bust a website generated by it was acknowledged as a major required feature that must be provided in the future project's toolchain. So the development of a cache-busting facility was begun which ultimately resulted in the delivery of Buster.

At the time of Buster's initial development it was decided that Buster was to serve two roles, one as a standalone utility and one as member of Trio's toolchain. As a standalone utility Buster would have to be dynamic enough to satisfy a variety of use cases that its users may require. However, as part of Trio's toolchain Buster would be used only to cache bust "in place", meaning that cache busting is applied directly to the files in the release folder and no ability to restore or reverse the actions of cache busting would be needed because that could be satisfied by merely rebuilding the project for release.

Since its initial release, Buster has become quite popular as a standalone utility and over time a pattern of its use as a standalone utility has emerged - the vast majority of its users are using Buster to cache bust their own projects "in place", just as how Trio internally uses Buster to cache bust its projects "in place".

With that revelation has come a decision to refactor Buster with the objective of simplifying its code base by removing all features that are not directly involved with cache busting "in place". The result will be a smaller and simpler code base that will be easier to maintain and which will be more in line with how it is actually being used by a vast majority of its users.

As an added benefit of refactoring an annoying bug in Buster will finally be addressed, and that is Buster's propensity to apply a file hash twice to a URL when it points to a file whose own name is in part used by another URL. For example, when hashing mybundle.js and Buster would ultimately hash as This bug has long been a pain point and addressing it in this refactoring will be a very high priority.

If you are currently using Buster as a standalone utility and you aren't using it to cache bust "in place" then we sincerely apologize for any inconvenience these changes may bring you. However, it shouldn't be very difficult to refactor your own projects to use Buster's cache busting "in place" by simply directing your project's build process to generate its release files into a dedicated folder which then can be targeted by Buster to be cache busted "in place".

Trio v5.0.0: Dart SASS

Trio v5.0.0

It is with great pleasure that I announce the release of Trio v5.0.0.

Trio is now using Dart Sass as its Sass Compiler

Trio is no longer using Node Sass as it and Lib Sass have been deprecated. Please note that this is a breaking change that could impact your stylesheets (Please see for more information).

Trio v4.2.0: Improved Developer Experience

Trio v4.2.0

It is with great pleasure that I announce the release of Trio v4.2.0.

Trio now ignores and reports fragments that do not have front matter defined.

Prior to v4.2.0, fragment files that did not have front matter generated errors that were confusing and unnecessary (as far as the user is concerned). These fragments are now reported to the console but otherwise ignored during the build process.

Page Composition Tutorials Introduction

The process of assembling your site's web pages with Trio is referred to as composition.

Trio's use of project assets, namely templates, fragments, includes, JSON data files, and metadata, all of which are exposed to tag-based callbacks, allow Trio to excel as a web page composition tool. This is perhaps best demonstrated by the following abstract:

a web page composition abstract

Therefore, as developers of static websites, we need to understand how to effectively use Trio's project assets in our own static site projects. Having this understanding will often reveal that there is more than one way to compose our pages, allowing us to pick the best approach for the task.

The tutorials in this series will teach you how to use Trio's project assets to compose your site's web pages. Each tutorial will introduce new concepts and provide concrete examples that you can read, code, and run for yourselves. Tutorials may also provide you with additional links to content, such as video content, as well as links to Trio's own technical documentation, that will serve to further demonstrate and reinforce what you have read and learned in the tutorials and finally, most of the tutorials in this series will provide you with a list of takeaways, which are a summarized list of the core concepts presented in the tutorial.


If you don't already have Trio and Node installed then please follow the instructions at Getting Started to install them.

Available Tutorials

Please follow @gettriossg on Twitter to get notified when new articles in this series become available!

  1. Basic Page Composition With Templates, Fragments And Includes - posted on 2020/11/16
  2. Advanced Page Composition With Fragment Front Matter - posted on 2020/12/10
  3. Advanced Page Composition With JSON Data - posted on 2020/12/11
  4. Advanced Page Composition And Collections: Part 1) Tutorial Introduction And Starter Project Setup - posted on 2020/12/24
  5. Advanced Page Composition And Collections: Part 2) Main Catalog Page - posted on 2020/12/24
  6. Advanced Page Composition And Collections: Part 3) 249 Detail Pages - posted on 2020/12/24