Dmitry Ishkov

The slowest part of loading a web page is almost always user network. If you have small images like an app logo that you don't want to wait for on network, one tool in your toolbox is to inline these images using base64 encoding. This is how inlined images look in a browser: Desired usage Our goal is to be able to write the following if we want to have an inlined image: import logo from 'images/app-logo.inline.png' and the following for the regular URL (notice the .inline. part of the file name): import logo from 'images/app-logo.png' It can be later used as usual via: <Image src={logo}/> Implementation How do we do this in Next.js? We have to add url-loader to package.json and tweak next.config.js . // next.config.js module.exports = { // ... webpack: (config) => { // find the built-in loader const imageLoaderRule = config.module.rules.find( (rule) => rule.loader === 'n...

Schema migrations is a must-have functionality for any DB framework. TypeORM provides decent utilities for dealing with migrations, however having a decade of experience in Ruby on Rails I got really spoiled and take some features for granted. One of these features is locking a database while a migration going on so 2 processes running concurrently don't step on each other's toes. This is also important when you run migrations in Kubernetes before launching your app. I was really surprised to find out that this basic feature is not supported , so decided to implement it on my own. Implementation // typeormMigrationUtils.ts import { Connection, createConnection } from 'typeorm' import config from '../ormconfig' import CRC32 from 'crc-32' const MIGRATOR_SALT = 2053462845 async function withAdvisoryLock( connection: Connection, callback: () => Promise<void> ): Promise<boolean> { // generate a unique lock...