100%

Usage

✓ Published0🌍 Public

Last edited Dec 13, 2017

Created on Dec 13, 2017

This example demonstrates how to replay a historical archived version of the CNN homepage through a headless Chrome browser. It loads a specific Wayback Machine capture from December 2017, setting the viewport to a fixed 1920×1080 resolution. The script uses Puppeteer to launch the browser, and injects a custom `magic` function that overrides `document.domain` to mimic the live site’s domain for proper page behavior. The navigation targets the archived URL directly, with a 60-second timeout, and any errors are logged to the console.

AI-generated description

Usage

npm install
npm run go

Requirements

node.js >= 8.0.0

MIT Licensed

Similar vizzes

Loading thumbnail…

test

This example shows a CNN homepage as captured by the Wayback Machine, with multiple interactive zones and containers that lazy-load content. The code defines a configuration object for CNN.Zones, listing twenty-seven zones and seven containers, and sets thresholds for sibling navigation and byline images. It uses JavaScript object literals and conditional error handling to manage webpack assets, but does not invoke any visualization libraries or render data directly. The page remains static in the provided body HTML.

NN0taN3rd

66% match

Loading thumbnail…

Gist 2d272134b57b02eb8cdd0c5904249591

This example tests the archival fidelity of a web page by loading a series of images and scripts that mimic dynamic behavior, including DOM manipulation, AJAX requests, and delayed updates. It uses JavaScript’s `XMLHttpRequest` to fetch remote images and replaces them via base64 data URLs, while `setTimeout` and scroll events trigger asynchronous content changes. The page is rendered within an iframe by the pywb web archiving tool, with a banner and rewrite layer applied. The visualization demonstrates how archived sites handle live interactions and resource loading over time.

NN0taN3rd

64% match

Loading thumbnail…

View CNN.com by iframe

This example demonstrates a historical snapshot of CNN.com’s homepage replayed inside a web iframe, using the pywb web-archiving framework. The visualization shows how the original page’s JavaScript-driven content, including lazy-loaded zones and carousels, is reconstructed from archived assets. The code references CNN’s custom inline scripts—such as `CNN.Zones`, `CNN.contentModel`, and `pageReveal`—alongside the iframe’s `seamless` attribute. The pywb replay uses `wb.js`, `wb_frame.js`, and `default_banner.js` to embed the captured page, with the source being a captured timestamp from the archive.

NN0taN3rd

63% match

Loading thumbnail…

Requires

This example demonstrates scraping public Twitter profiles with Puppeteer, a headless Chrome automation library, to extract tweet content, timestamps, embedded image URLs, and adaptive media containers. It also shows scraping a live webpage via the Wayback Machine to capture a full-page screenshot at 1920x1080 resolution. The script uses Puppeteer’s `page.evaluate` to run DOM queries, Bluebird’s `Promise.delay` for controlled waiting, and `fs-extra` to write the collected tweet data as JSON. It navigates pages, clicks "show more" links, and scrolls to trigger dynamic content loading before saving results.

NN0taN3rd

62% match

Loading thumbnail…

Web Archive Bookmarklet Code

A one-line JavaScript bookmarklet opens the current page in the Internet Archive’s Wayback Machine. The code triggers `window.open` on the URL formed by concatenating `'https://web.archive.org/web/'` with the live document’s `location.href`. This example demonstrates URL string construction and the Web’s `window.open` API for navigation, with no charting or graphics libraries involved. The plain text snippet contains no data visualization logic, showing instead a minimal utility for historical page capture.

NNGuernse

62% match

Loading thumbnail…

use chrome to crawl

This example demonstrates automated web crawling and interaction using Chrome's remote interface. The code navigates through URLs from a seed list, captures page HTML and window environment variables, and programmatically clicks all elements with click event listeners. It manages JavaScript dialogs and navigation timeouts, while logging errors. It relies on Chrome's Remote Interface (CDP), along with Bluebird for promise handling, and custom detectors for JS library identification.

NN0taN3rd

61% match

Loading thumbnail…

Still Drinking Gin And Juice

This example plays a trick on the Wayback Machine by loading a hidden iframe that captures the archived page’s React and ReactDOM libraries, then re-mounting a new React component inside that iframe. The visualization itself is not yet defined in the provided snippet, but the code sets up a full-screen canvas-driven animation framework using React and the browser’s native canvas and animation APIs. Images of frogs and a banner are fetched from the Internet Archive’s geocities.com captures, hinting at a playful, retro-themed visual collage. The page also manipulates browser history to disguise its origin and hides the archive’s toolbar.

NN0taN3rd

60% match

Loading thumbnail…

Gist 669840e74e5d863f3867c2946eb31ece

This example uses a headless Chrome setup, orchestrated through a Dockerfile, to render a dynamic web visualization. It shows an animated, interactive scene that likely involves geographic or force-directed elements, as the environment installs Chrome and chromedriver for automated screenshotting or streaming. The Python-based driver, running via `main.py`, relies on Selenium to control the browser and capture frames, while the underlying page would use D3.js’s `d3.forceSimulation` for physics-based layout and `d3.geoPath` for map projections if applicable. The setup explicitly avoids displaying a static image; instead, it captures live rendering from the Canvas or SVG, though the exact output is not visible in the code.

CConorAspell

59% match