sintaxi / harp

Static Web Server/Generator/Bundler
http://harpjs.com
4.99k stars 346 forks source link

Liquid preprocessing. #662

Closed c4lliope closed 1 year ago

c4lliope commented 3 years ago

@sintaxi –

Jekyll is used for GitHub pages, and is an incredible program; perhaps bragging the largest userbase of any static-page compiler.

Sadly, compiling Jekyll pages can be laboriously slow, because the Liquid template engine is processed in Ruby. Some compiles I ran took ~7 seconds for an average-sized page, meaning the programming loop is long and slow.

I am hoping Harp can help ease our pain, by becoming a quicker preprocessor of our template files, using https://liquidjs.com/. I am curious if you could point out any places in your codebase where you would begin looking, if we're seeking to add Liquid template support.

Much obliged, Grace

c4lliope commented 3 years ago

I more-or-less copied the EJS processor to create the Liquid one. One error remains:

  2) templates
       .liquid
         should render liquid file:
     AssertionError [ERR_ASSERTION] [ERR_ASSERTION]: expected [

<h1>Hello Liquid</h1>
{{ partial("stuff.md") }}
] {
  source: 'Liquid',
  dest: 'HTML',
  filename: '/Users/grace/place/github.com/sintaxi/terraform/test/fixtures/templates/bio.liquid',
  lineno: NaN,
  name: 'TypeError',
  message: 'render is not a function'
} to not exist
      at /Users/grace/place/github.com/sintaxi/terraform/test/templates.js:1:1
      at Object.render (lib/terraform.js:1:1)
      at Context.<anonymous> (test/templates.js:1:1)
      at processImmediate (internal/timers.js:1:1)
c4lliope commented 3 years ago

Seems like making Liquid plug-and-play in Harp requires massaging the layout / partial mechanism.

In Liquid and Jekyll, you use {% include page.html %} to include a partial. Jekyll uses YAML frontmatter for rendering layouts.

The layout / partial mechanism in Liquid.js seems baked-in already, so the default mechanism will not function for, e.g. .md or .jade partials or layouts; it is Liquid-only.

I need a rundown on the partial / layout mechanism in Harp to know how to override the default Liquid.js behavior. Please advise?

Probably necessary: https://liquidjs.com/tutorials/render-file.html https://liquidjs.com/tutorials/partials-and-layouts.html

sintaxi commented 3 years ago

Hi @c4lliope

Thanks for the inquiry. It looks like you're on the right track. partial() works independently of built in include because it is implemented in terraform. In fact, the rendering of a page is actually itself just calling partial() and passing in the global and local variables. partial() should not override include they should remain different things.

Hope this helps.