Software Engineer.
@deprecated motion graphic designer and photographer.
@author
Teng Wei Herr
A designer/photographer-turned-software-engineer, occasionally writing tech articles and contributing to OSS projects.
Besides work, I like playing basketball, tennis, and chugging coffee.
I am currently based in Malaysia. Do you know we have the best food ever?
Tech I've worked with:
- Next.js
- React
- TypeScript
- Zustand
- MobX
- Redux
- Webpack
- Node.js
- Supabase
- PostgreSQL
- Kafka
- Spring Boot
@works
Where I've worked & volunteered:
2022 - Present
Web Engineer
MoneyLion Inc.
Web Engineer
2 years 7 months
- Identified web performance bottlenecks and reducing total blocking time by up to 90%.
- Implemented zero-runtime-cost caching for third-party assets from CMS using SSG and build-time scripts with node-fs in Next.js.
- Migrated a React SPA to a Next.js isomorphic web app, achieving a 16x faster load time with 50% less code.
- Fine-tuned K8s resources with auto-scaling, minimized request latency & Kafka consumer lag and setting up Datadog monitoring to handle 30K RPS spikes.
2024 - 2025
Founding Engineer
PAYGAP Asia
Founding Engineer
7 months
- Architected and developed the system from 0 to 1, making key technical decisions like tech stack selection, database design while ensuring alignment with business objectives.
- Implemented cursor pagination with database indexing and SWR client-side caching to support high-volume search requests with minimal latency.
- Translated Figma static designs to web animations through SVG animation, Framer Motion and Rive.
- Strengthened AppSec by adopting server-side functions, proxying PostgREST via an BFF service, and refining RLS policies and Cloudflare rules.
2019 - 2024
Motion Graphic Designer
HERR Studio
Motion Graphic Designer
5 years
- Expertise in Adobe Creative Suite including Illustrator, After Effects, Photoshop, etc
- Worked with international clients to produce high quality media content across various domains including finance, interior design, corporate, and government units.
Web Engineer
2 years 7 months
- Identified web performance bottlenecks and reducing total blocking time by up to 90%.
- Implemented zero-runtime-cost caching for third-party assets from CMS using SSG and build-time scripts with node-fs in Next.js.
- Migrated a React SPA to a Next.js isomorphic web app, achieving a 16x faster load time with 50% less code.
- Fine-tuned K8s resources with auto-scaling, minimized request latency & Kafka consumer lag and setting up Datadog monitoring to handle 30K RPS spikes.
Founding Engineer
7 months
- Architected and developed the system from 0 to 1, making key technical decisions like tech stack selection, database design while ensuring alignment with business objectives.
- Implemented cursor pagination with database indexing and SWR client-side caching to support high-volume search requests with minimal latency.
- Translated Figma static designs to web animations through SVG animation, Framer Motion and Rive.
- Strengthened AppSec by adopting server-side functions, proxying PostgREST via an BFF service, and refining RLS policies and Cloudflare rules.
Motion Graphic Designer
5 years
- Expertise in Adobe Creative Suite including Illustrator, After Effects, Photoshop, etc
- Worked with international clients to produce high quality media content across various domains including finance, interior design, corporate, and government units.
@published
React Internals: Which useEffect runs first?
It's not particularly obvious, but a child's useEffect will run before a parent's will. Let's look at why.
Adaptive Video Streaming With Dash.js In React
A complete guide to build a ABR video player in React starting with a MP4 video
Next.js SSG: Caching Third-Party Assets for Zero Runtime Cost
Minimizing Bandwidth Usage by Serving Third-Party Assets Statically in Next.js
How to Identify Web Performance Bottlenecks Using a Browser Profiler
A Step-by-Step Guide to Diagnosing Performance Issues in Web Applications
Chrome’s Performance Panel 101: What’s Going on in Your JavaScript Main Thread
Learn to use the profiler in Chrome’s Performance Panel with my favourite settings and some useful tips
Animated Bar Chart with D3.js and React
Learn the underlying concepts and how to plot charts with D3.js and React
Next.js Middleware: Server-side A/B Testing for Enhanced Performance
Server-side Feature Flagging via Firebase Remote Config Using Next.js Middleware — With Optimal Performance
View more at Medium
Get in touch
Drop me a message if you have any questions or just want to say hi.
Any collaborations and opportunities are welcomed.
