johnsylvain / pagine Goto Github PK

The main Pagine class (./src/index.js) needs to be better commented using the JSDoc specification.

Refer to http://usejsdoc.org/index.html JSDoc specs.

Users should be able to pass in the location of the markdown file into the constructor function and have the content be loaded by an ajax call.

Current Behavior
Markdown content has to be typed directly into new Pagine({ ... }) call.

new Pagine({
// ...
  md: '# markdown' // markdown has to be added here as a string
// ...
});

New Behavior
Users should only have to place the markdown file's relative url into the constructor function.

new Pagine({
// ...
  md: './path/to/markdown.md' // markdown path
// ...
});

Currently, it can only be used with a module bundler. We should be able to bundle it into a minified file to include in a script tag

Current behavior
Markdown has to be transformed to HTML on every route change

Expected behavior
Compiled HTML should be cached in an Object and checked before compiling Markdown.

this.cache = {
  md: {}, // markdown cache
  html: {
    '/': '<div></div>',
    '/about': '<div>About</div>'
  }
}

The usage section of the README needs to be updated. The new api design looks like the snippet below.

JavaScript

import Pagine from 'pagine';

new Pagine({
  view: '#view',
  routes: [
    {
      path: '/home',
      md: './markdown/home.md',
      layout: '#main'
    }
  ]
})

HTML

<div id="view"></div>
<script type="text/html" id="main">
  <%= content %>
</script>

Refactor build process to use microbundle instead of webpack

A simple 404 error page needs to be added if the route does not exist. This logic should be added in the Pagine class (https://github.com/johnsylvain/pagine/blob/master/lib/pagine.js).

In order to increase performance, templates and markdown content should be cached.

Use the fast-memoize library to memoize template function calls.

Replace Navigo with a vanilla JavaScript router. While Navigo provides many useful features, it is not entirely necessary for this project.

A much smaller implementation can be created that accomplishes the same goal.

Markdown files should be fetched (as proposed in #9) then cached.

Should be refactored to use more performant es6 classes.

Remove the lodash templating function and replace it with a vanilla implementation. The goal is to reduce project dependancies and bundle size.

Refer to John Resig's implementation of a simple templating engine.

Change module bundler from Webpack to Rollup for more performant bundles.

Testing (via jest) is currently broken for checking route changes. We should be able to test content is being rendered properly when routes change.

Current: https://github.com/chjj/marked
New: https://github.com/developit/snarkdown