Photo by Chris Ried on Unsplash

DevLog 002

Video version of this post

Although it’s nice that people can read my posts and watch my videos, sometimes it’s better to be able to look at the source code itself. So, I’ve made the rational decision to share my code on GitHub a bit earlier than usual.

There won’t be much coding here, so it’s going to be a noticeably short post.

You’ll see why…

Creating a GitHub Project from WebStorm

I want to create a new GitHub project from the website that I made in my previous DevLog: https://bayanbennett.medium.com/how-i-started-a-website-d2a34547bc57


DevLog 001

I’m trying to make a new website, and this will be the first in a series of DevLogs about my development process as I build this website.

Video version of this post

The idea of the website came from the need to store information that isn’t necessarily deserving of an entire blog post. These posts cover some of the things that I’m currently doing as well as some fundamentals of software development.

The tentative name is reference.bayanbennett.com and will serve as an ever-evolving repository of information. Whenever I’m referencing things, I can point to reference.bayanbennett.com and the page could contain…


Implementing a basic queue in TypeScript & JavaScript

I see the code of a programmer
Be it good; or be it bad
Adding a queue will make me glad

While implementing optimizations, software developers may encounter performance issues that extend beyond a particular function or module. A potential problem in architecture, where two modules are tightly coupled, but have vastly different or unpredictable execution speeds.

Code doesn’t have to be a linear set of operations, in fact, your operating system would be running much slower if it weren’t for an uncomplicated design pattern: queues.

Photo by Michał Parzuchowski on Unsplash

What? Why?

Imagine a lineup of people outside of a popular donut shop. Each of them…


I once spent half a day debugging issues in a codebase only to discover that the cause was a horribly butchered TSConfig file. It looked like the file was pieced together with config options from random tutorials. As if, after the creation of the tsconfig.json file, tsc was run and someone exclaimed "it works!" Hands were clapped, and then project development just moved on without a second thought.

Photo by Bradley Howington on Unsplash

After finally figuring out the cause of all the error messages, I thought, “ESLint has eslint:recommended and @typescript-eslint/recommended, there must be a recommended tsconfig out there."


Typing Practice w/ Machine Learning

Articles in this series:
1. Introduction
2. Pseudo-English
3. Keyboard Input
4. Inference Using Web Workers (You Are Here)

The finished project is located here: https://www.bayanbennett.com/projects/rnn-typing-practice

The last post, Keyboard Input, was all about preparing the data that will be used to generate subsequent lines of characters. This article looks at how that input is used and how a line of text is generated using a TensorFlow model. Additionally, this model will be running entirely on a WebWorker.

To learn more about web workers, I’ve created a soft introduction here: Barebones Web Workers.

Photo by Michael Dziedzic on Unsplash

Setting Up the Worker

The following code is all within the…


Once there is enough of a reason to offload calculations into another thread, WebWorkers begin to shine.

Photo by Josue Isai Ramos Figueroa on Unsplash

For me, this happened when I was creating the RNN Typing Practice app, where I was doing inference with TensorFlowJS and didn’t want that heavy calculation to be handled on the main render process. The user would be trying to type a given sentence while calculations for the next sentence were made. If there was any impact on the user’s typing experience, it would make the app unusable. …


Building a site with React, but that doesn’t have JavaScript in the final build is a paradox.

Requirements

I had a special case come up where I needed to build a site that:

  • Only had static HTML
  • Didn’t have any JavaScript whatsoever

Weapon of Choice

React still was an attractive option due to its composability and the widespread availability of libraries. Other JS libraries (Vue | Angular | Svelte) might work as well, but I am not familiar with their SSR capabilities.

Being familiar with GatsbyJS, it’s out-of-the-box SSR feature seemed like a good fit for the requirements. Alas, although there are plugins like…


Typing Practice w/ Machine Learning

Disclaimer: although this series is about machine learning, this post won’t have any in it.

Articles in this series:
1. Introduction
2. Pseudo-English
3. Keyboard Input (You Are Here)
4. Web Worker Inference

The finished project is located here: https://www.bayanbennett.com/projects/rnn-typing-practice

Photo by Peppy Toad on Unsplash

Requirements

  • Displays an area that the user will have to activate
  • Displays a sequence of letters
  • Receives keyboard inputs
  • Compares input to the current letter
  • Progresses from one letter to another with the correct input
  • When the cursor reaches the end of the line, it moves onto the next line.

Letters

Requirements met:

  • Displays a sequence of letters

I was curious to…


Typing Practice w/ Machine Learning

Articles in this series:
1. Introduction
2. Pseudo-English (You are here)
3.
Keyboard Input
4.
Web Worker Inference

The finished project is located here: https://www.bayanbennett.com/projects/rnn-typing-practice

Objective

Generate English-looking words using a recurrent neural network.

Trivial Methods

Before settling on using ML, first I had to convince myself that the trivial methods did not provide adequate results.

Random Letters

const getRandom = (distribution) => {
const randomIndex = Math.floor(Math.random() * distribution.length);
return distribution[randomIndex];
}
const alphabet = "abcdefghijklmnopqrstuvwxyz";const randomLetter = getRandom(alphabet);

Unsurprisingly, no resemblance to English words. The character sequences that were generated were painful to type. …


I first came across the concept of embeddings while developing the RNN typing practice app.

Even though I am just beginning to understand the range of uses for embeddings, I thought it would be useful to write down some of the basics.

First, let’s look at what I knew before embeddings, one-hot vectors.

Photo by Awesome Sauce Creative on Unsplash

Refresher on one-hot vectors

Remember one-hot vectors? No? Well do you remember unit vectors from math class? Still no? Okay — assume that we have three labels, [🍎, 🍊, 🍌]. We want to represent these values in a way that machines can understand. …

𝐁𝐚𝐲𝐚𝐧 𝐁𝐞𝐧𝐧𝐞𝐭𝐭

My goal is to serve humanity and to bring happiness to others. I want to understand the problems around us and help find solutions. https://www.bayanbennett.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store