Hi, I'm Eric Kwoka. I am a Full-Stack Engineer and User Experience Professional

Scroll Down

Most Developed Skills

A sampling of the core technologies I have become talented in. There are always more things to learn, but I have found a lot of the underlying skills here to be transferrable as I explore new technologies.
  • TypeScript TypeScript
  • AlpineJS Alpine
  • Rust Rust
  • Shopify Shopify
  • Tailwind CSS Tailwind

Professional Work Oso & Me

Live Site

Ecommerce site for a children’s clothing brand. Fully custom built the Shopify theme with Alpine and Tailwind, including replacing many app widgets with integrated custom widgets interacting with the apps APIs.

Characteristics

  • 1000+ Products
  • $2 million+ in sales +~200% YoY

Features

  • Customization of products with Monogram previews
  • A highly reusable and customizable image row section (used for nearly every section on the homepage)
  • AlpineJS alpine
  • Shopify shopify
  • Tailwind CSS tailwind

Package Alpine Types

More Info about Alpine Types package npmjs View Repo

Despite being quite popular, AlpineJS does not have native TypeScript support! To solve this issue, I maintain the @types/alpinejs package, which provides TypeScript types for AlpineJS.

This includes types for the core AlpineJS frameworok as well as the multitude of Core Plugins.

  • @types/alpinejs__anchor
  • @types/alpinejs__collapse
  • @types/alpinejs__focus
  • @types/alpinejs__intersect
  • @types/alpinejs__morph
  • @types/alpinejs__mask
  • @types/alpinejs__persist
NPM VersionNPM DownloadsNPM Type Definitions

Package Weak LRU Cache

More Info about Weak LRU Cache package npmjs View Repo

A simple implementation of an LRU cache that expires items with Weak References to allow the cache items to continue to be reused until garbage collected.

Implements the entire Map api, allowing easy drop in usage in existing apps using Maps to cache responses.

NPM VersionNPM DownloadsMINZIPPED SizeNPM Type Definitions

Package ESLint Filename Enforcement

More Info about ESLint Filename Enforcement package npmjs View Repo

A simple ESLint plugin to enforce the name of JS and TS module files matching to the names of their exports.

Rules:

  • match-named-export: Enforces that the filename matches to a named export.
  • match-default-export: Enforces that filenames match the name of the default export.
NPM VersionNPM DownloadsMINZIPPED Size

Open Source Contributions

AlpineJS alpine

Refactors `x-for` for speed

Improves x-for template looping logic by ~15-60% while reducing code size and improving maintainability. Oh, and it corrects a bug when paired with x-sort directives.

htmx HTMX

Prevents erroring on null vals

While hx-vals allows JSON values, HTMX improperly handled serialized null values causing code failure. This corrects the issue.

Flamethrower Router

Performance Optimizations

Improves the performance of the DOM diff’ing algorithm, optimized for the most common scenarios.

AlpineJS alpine

Fixes Memory Leak with Nested Template directives

When template directives were used and nested, if the outer template was cleaned up, the elements created by the inner template would not be cleaned up, leading to errors, and a major memory leak. This solves that, while speading up the cleanups, and reducing overall code size.

AlpineJS alpine

Improves Proxy Merge Performance

Improved the Proxy stack handling to speed up context property accesses by ~20% and reduce memory usage by 75%, all while reducing the amount of code, and adding JSON serialization.

AlpineJS alpine

Add Promise to $nextTick

To bring the functionality more inline with Vue’s implementation of $nextTick, the magic returns a Promise that resolves when the callback is run.