• This repository has been archived on 14/Jan/2024
  • Stars
    star
    307
  • Rank 136,109 (Top 3 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created about 2 years ago
  • Updated 11 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Make your site faster than light in <1 minute; instant page loads in 738 bytes

Tachyon is a byte sized script that makes your website feel blazingly fast. It does this by prerendering pages before a user navigates to them, making page transitions virtually instant.

Documentation for Tachyon lives at fasterthanlight.net

Quick Links:

Easy Setup Instructions:

Tachyon Instant.Page Quicklink Turbolinks
Size 738 b 3.14 kb
(4.3x larger)
60.1 kb
(83x larger)
111 kb
(153x larger)
Bandwidth
Overhead
Lowest Low Highest High
Prerendering
(Fastest Loads)
No Addl.
Code Required
Works on
ALL links
Whitelist &
Blacklist

Using Tachyon

Using Tachyon is unbelieveably easy; it's super tiny, so you can just inline it. All you have to do is copy the <script></script> tags below and put them somewhere on your site.

<script type="module" defer>/* tachyon 2.0.1 */var e=document.body.dataset;const o="tachyonWhitelist"in e,n="tachyonSameOrigin"in e,a=e.tachyonTimer||50;let r=null;function i(){r=r?null:this;const t="tachyon";var e=document.getElementById(t);e?e.remove():setTimeout(()=>{var e;r===this&&((e=document.createElement("link")).id=t,e.href=this.href,e.rel="prerender",document.head.appendChild(e))},a)}function t(t){var e;t.dataset&&(e="tachyon"in t.dataset,"A"!==t.tagName||!t.href||e!=o&&!n||n&&!e&&t.origin!==window.location.origin||["mouseover","mouseout","touchstart","touchend"].forEach(e=>t.addEventListener(e,i,{passive:!0})))}new MutationObserver(e=>e.forEach(e=>e.addedNodes.forEach(t))).observe(document.body,{childList:!0,subtree:!0}),document.querySelectorAll("a").forEach(t);</script>

Et voila! Your website is now faster than light!

If you look on the website, there are also easy install instructions for Google Tag Manager, Shopify, WordPress, and more.

Tachyon is also available via npm as tachyonjs.

npm i tachyonjs

You can also get Tachyon from any Javascript CDN—unpkg is recommended, though!

<script src="https://unpkg.com/[email protected]/tachyon.min.js" integrity="sha384-4iJteL1FYnj4Ju83AJvNthpx5gZ1QaXCamXhY3lxhAjTNXUN+NXq5LQV/fXOSRme" type="module" crossorigin defer></script>

Configuration

Tachyon implements the following using data-tachyon-* attributes:

Issues

Tachyon subscribes to the following philosophy:

  • If this project is not helping you, then there is a bug
  • If you are having a bad time using this project, then there is a bug
  • If the documentation is confusing, then the documentation is buggy
  • If there is a bug in this project, then we can work together to fix it.

There is a list of known issues on the website—if anything else comes up, though, please do open an issue in the issue tracker.

Cheers To

  • You (the reader) for your support, contribution, and time; I'm glad this project has been beneficial to you
  • Alexandre Dieulot, creator of instant.page which undoubtedly paved the way for Tachyon
  • frontendfoc.us for the completely unexpected positive press while this project was still in its infancy

Star History Chart