blog.yaox023.comImage Smoothing in ResamplingThe issue When we draw image in canvas, we may do scaling up or scaling down the image size. For example, if the image has size 100*100, we may want it to cover the whole canvas. If the canvas size is 200*200(bigger than image size), then this is sca...Oct 6, 2023·4 min read
blog.yaox023.comReusing React Component With React RouterThe Issue Consider this case. I am building a spa with multiple page. There is a video in page A and also the same video in page B. I want to preserve the video playing state even if when user navigate from page A to page B. Suppose we have this Vide...Sep 24, 2023·6 min read
blog.yaox023.comWriting a GIF DecoderIn this article, let's write a gif decoder in typescript. Parser Say we have a gif file, the first we need to do after loading the file is to parse it. We can find the format of the gif in GIF89a Specification. It has defined a clear grammar for the ...Sep 23, 2023·9 min read
blog.yaox023.comSync React Component with Global VariableUsually, react component will only read data from states, props or context. Or we can use any third party library such as redux to store global data.This covers most of the cases, but what if we want our component to be sync with a global variable? F...Aug 24, 2023·4 min read
blog.yaox023.comBetter debugging for styled componentsIf you are using styled components, then you may also consider using babel-plugin-styled-components. This is a plugin for babel, which provides a few useful configurations, such as: ssr: for server side rendering support displayName: show component...Aug 2, 2023·1 min read
