vegetableman / vandal

Vandal is a browser extension that helps you quickly navigate the web archive and travel back in time without leaving the current tab.

Install

also compatible with

• Why?
• Features
• Limitations
• Comparison to Wayback Machine
• Build
• API and Tools Used

Why?

The goal of this project is to present an alternate navigation interface to Wayback Machine focused on ease-of-use. At the same time, it tries to capture the essence of ⌛ time-travel in it's own whimsical way.

Features

Vandal supports the following features for navigation and inspection:

• 📅 Calendar View: The default navigation mode which uses the least amount of surface area with a mini calendar view. Supports a calendar input that shows archival stats and allows selection of month across the years.
• 📊 Graph View: Navigation mode based on graphs of year and month.
• 🧭 Navigator: Built-in browser with ◀️ ▶️ 🔄 actions.
• 🎮 Navigation Panel: A bottom panel with navigation buttons to zip through archived snapshots for a date or across the month.
• 🕛 History Panel: Access your navigation history for a website.
• 💡 Info Panel: Access your current navigation URL and redirection info.
• 🔩 Resource Drawer: A drawer that you can toggle to view timestamp differences of resources such as images, scripts, etc. relative to the page. This drawer updates automatically based on URL.
• ⌛ Historical View: Displays the snapshot of a website throughout the years. This feature is experimental ⚠️.

Limitations

• It uses Iframe to load a webpage which has inherent limitations, although Vandal does replicate the behaviour of a browser to some degree, for instance, navigation history, reload, etc. It does not work in cases where pages are using frame busters and when the document matching the URL itself is cached using service workers causing the webRequest API to fail. It does notify with an error message for such cases.
• It does not support saving page to Archive. Although, It does notify you to do so on an unarchived page.

Comparison to Wayback Machine

Vandal is not affliated to Internet Archive. As for features, it's more of a subset to the mighty Wayback Machine.

Build

Requirements

Node.js version 14 or later is required.

Install dependencies:

npm install

To create a build:

npm run build 

When working on the extension, run below to constantly build your changes:

npm run watch # Listen to file changes and automatically rebuild

Then load or reload it into the browser to see the changes.

Loading into the browser

Once built, load it in the browser of your choice with web-ext:

npx web-ext run --target=chromium # Open extension in Chrome

npx web-ext run # Open extension in Firefox

API and Tools Used

Vandal uses the Wayback Machine API.

It is primarily built on frameworks - XState and React. Illustrations and logo was created on Figma, video edited on Kapwing and icons have been plucked from the Noun Project.

Icons designed by: Christian Antonius, Ralf Schmitzer, Park Sung Hyo, Bhuvan, Sewon Park, Alfa Design, Emmanuel Roy, unlimicon, Hui Qin Ng, Bluetip Design, iconsmind.com, mikicon, Bharat, Aaron K. Kim, i cons