Beautiful Router will send a GET request from all links present the HTML page. Then it will storage the response in cache. So when the website viewer clicked on a link, the associated content will be injected in the view faster than the server's response waiting.

How to use it ?

Using Beautiful Router involves than all of your pages have the same structure (header, navbar, main, footer,...), so it's advised to use a template manager like Twig to organize your partials.

First of all import script in your HTML.

<html>
  ...
  <body>
    ...
    <script src="https://unpkg.com/beautiful-router@1.0.4/dist/beautiful-router.min.js"></script>
  </body>
</html>

Then insert your movable content into a tagged div element.

<html>
  ...
  <body>
    <div id="router">
      <!-- Your website's content will be automatically injected here. -->
    </div>
    <script src="https://unpkg.com/beautiful-router@1.0.4/dist/beautiful-router.min.js"></script>
  </body>
</html>

Finally call Beautiful Router class and enjoy your new router !

<html>
  ...
  <body>
    <div id="router">
      <!-- Your website's content will be automatically injected here. -->
    </div>
    <script src="https://unpkg.com/beautiful-router@1.0.4/dist/beautiful-router.min.js"></script>
    <script>
      new BeautifulRouter("#router");
    </script>
  </body>
</html>

Keywords

router

FAQs

What is beautiful-router?

Is beautiful-router well maintained?

Package last updated on 01 Sep 2023

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install