Skip to main content
100%

Golang.org code highlight

✓ Published0🌍 Public
Aadkdev
Last edited Jun 7, 2021
Created on Jun 7, 2021

This example shows a userscript that automatically adds syntax highlighting to code blocks on golang.org and godoc.org pages. It selects every `<pre>` element in the document body and assigns the `prettyprint` class, then injects a script tag pointing to Google’s code-prettify loader (`run_prettify.js`) from a CDN. The rendering approach relies entirely on the prettify library’s default behavior to colorize Go source code. The script, authored by netroby and sourced from a GitHub repository, runs on page load without external data or configuration.

AI-generated description

Similar vizzes

Loading thumbnail…

highlight.js

This example demonstrates how to display a JavaScript object as formatted, syntax-highlighted code on a web page. It uses the highlight.js library to apply color-coded styling to a JSON string representation of a small dataset, while D3 v4 populates the `<code>` element with the data. The code first defines an array of objects with name and size properties, then uses `d3.select` and `json.stringify` to insert the formatted data into the page. The visible result is a clean, readable code block, though no interactive visualization is present.

EEfratVil
61% match
Loading thumbnail…

Golang Notes.md

This visualization parses a Golang markdown cheat sheet into a side-by-side comparison of equivalent syntax patterns. It shows two code snippets, labeled A and B, for common operations like variable initialization, slice creation, and map declaration. The rendering uses the marked library to convert the markdown source into styled HTML blocks, with each pair displayed in parallel columns. The data comes from a gist authored by amazingandyyy, and the layout highlights structural differences between the two coding styles.

Aamazingandyyy
61% match
Loading thumbnail…

Prose-only Blocks

This example demonstrates a prose-only block on bl.ocks.org, created from a Gist containing a single README.md file with no index.html. The block renders the README content as the main display, omitting the usual iframe visualization area. The implementation filters Gists based on file presence and renders additional file sources, while syntax-highlighting embedded code blocks using the Gist API and GitHub’s default UI. The page also includes a JavaScript shuffle function example to illustrate embedded code.

Mmbostock
60% match
Loading thumbnail…

Showing how much better Gists look than Medium code blocks.

This example highlights the visual superiority of GitHub Gists over Medium’s code blocks by presenting a shell script that conditionally runs Behat tests. The code checks whether a Travis CI push event or a JavaScript commit triggers the test suite, using environment variables and the Behat testing framework. The gist’s clean syntax highlighting and line numbering make the conditional logic immediately readable, whereas Medium’s plain styling obscures the script’s flow. It demonstrates how gist embeds preserve code clarity for technical audiences.

Aalexfinnarn
60% match
Loading thumbnail…

Syntax Highlighting for Print

This example shows how to render JavaScript source code as a styled, print-ready image using syntax highlighting. It uses Prism.js to apply Solarized Light syntax highlighting and line numbers to a code snippet from a D3 visualization. The styling, including a custom font and rounded border, is achieved with CSS. The code itself demonstrates the `renderCircles` function, which uses `selectAll`, `data`, and `join` to bind and update circle elements.

CCurran Kelleher
58% match
Loading thumbnail…

Gist ac3b3d8bc1faa1422b4260218a23d444

A userscript injects a persistent "EDIT" link into Gitbook documentation pages. The script uses the Tampermonkey API via a `@match` directive and runs on `docs.openbrush.app`. It appends a fixed-position anchor element to the document body with `appendChild`, styling it through inline CSS properties. The link’s `href` updates on mouseover by replacing the current URL’s path with an equivalent Gitbook editor address, using `document.location.href` and string concatenation. The code relies on `setTimeout` to delay injection by one second, ensuring the page has loaded before modification.

Aandybak
58% match
Loading thumbnail…

Gist 7f5cc15d0eae9281c33b735420ae8ee0

This example transforms a PmWiki source page into a searchable interface for code snippets. It fetches the page’s source via the `fetch` API, splits it into lines, and tokenizes text wrapped in `@@` delimiters. Each snippet becomes a clickable link that queries GitHub’s gist search for matches by the user “Utopiah”. The script uses `document.querySelectorAll` to locate existing `<code>` elements in the page and replaces their content with the generated anchor tags, while logging any unmatched snippets. It relies on vanilla DOM manipulation and URL construction, with no external visualization libraries.

UUtopiah
57% match
Loading thumbnail…

0414_html

This example demonstrates the use of HTML’s `<pre>` tag to display a block of preformatted text, including entity references and special characters, within a simple page layout. The page structure includes a header, a section containing the preformatted text, a horizontal rule, and a footer with copyright information. The code relies on basic HTML5 elements and inline CSS attributes, such as `size`, `align`, and `width` on the `<hr>`, without any JavaScript or external libraries. The content is static, presenting book details and pricing in Korean.

RRoh-2040
57% match