Karl Herrick

A technologist and web developer | Posts about technology encountered along the journey.

Code Highlighting

It seemed like a neat idea to encapsulate syntax highlighting responsibilities for the various code snippets that I share at times, so I went ahead and wrote a custom element to help me take care of the job. To try it out, install x-postpress-code with your favorite package manager and import into your project. If you like going buildless [1, 2], load it from a CDN like unpkg or skypack:

<script
  src="https://unpkg.com/x-postpress-code@1.0.3"
  type="module"
></script>

Once registered, the web component requires a type attribute to identify which supported language should be highlighted. The content of the code itself can either be lazy loaded using the src attribute, or by including the source in the default slot surrounded by pre tags:

<x-postpress-code type="bash"><pre>
#/usr/bin/env bash
for file in *; do
  echo $file
done
</pre></x-postpress-code>

One nice side effect of defining the code this way, is that if JavaScript is disabled for whatever reason, the original is still rendered (although unhighlighted). Try it out at JS Bin, or checkout the project page for more information.


Fast Traxx Pi

I thought it was a good time to revisit trying to control an RC car’s handheld remote, so I returned to the community assistance I first started at and gave it a try. In the end, I just had to wire up some transistors to the remote control as well as a few resistors leading back to the GPIO pins on the Pi.

The software side is fairly straightforward as it implements basic driving functionality and requires only a few Node.js dependencies (the rpio library and an experimental one to handle keyup and keydown events). Running the main script from the github repo sets up four pins as outputs, and are triggered when the arrow keys are pressed. Ctrl+C can be used to exit.

Controlling the car directly would be more efficient, but as far as a proof of concept, doing it indirectly through the remote control works really well. Adding the Camera Module would be a good next step, but even at this point the process has got me thinking that a Pi Zero would be a nice addition to a platform like RC car that you can buy at the store — especially something like this Fast Traxx. Driving it with a keyboard over SSH is such a cool experience.


TensorFlow.js Component Playground

A progressive web app with pwgen.

After experimenting with the AIY Vision kit and the Coral USB Accelerator I decided to try “edge computing” from another angle by wrapping up TensorFlow.js with LitElement to make a few Web Components for testing. The tfjs-backend-wasm package is loaded to use WebAssembly for the backend and while it seems similar to WebGL for lite models, it performs worse when using medium-sized ones. Fortunately, they’re commited to supporting the platform and will continue to improve it.

The models are setup with little modification to the configuration, so watching what’s detected and how things are classified before diving into the actual building and changing of them is interesting. Google’s AutoML project might be something to check out next. Each component has methods exposed so the user can provide images or video to inference—for example:

The last thing of note is that all image classification, object, and facial detection is completed client-side. It’s by design, more private by not sending the data to the server—kind of neat.