UMSUNGJUN Blog

UMSUNGJUN Blog https://umsungjun.com/en/blog Problems I've run into at work and how I solved them, translated from my Korean blog. en Wed, 26 Aug 2026 11:17:42 GMT A close look at Next.js rendering: CSR, SSR, SSG, ISR, and Hydration https://umsungjun.com/en/blog/nextjs-%EB%A0%8C%EB%8D%94%EB%A7%81-%EB%B0%A9%EC%8B%9D-%EB%84%A4-%EA%B0%80%EC%A7%80csr-ssr-ssg-isr%EC%99%80-hydration-%ED%86%BA%EC%95%84%EB%B3%B4%EA%B8%B0 https://umsungjun.com/en/blog/nextjs-%EB%A0%8C%EB%8D%94%EB%A7%81-%EB%B0%A9%EC%8B%9D-%EB%84%A4-%EA%B0%80%EC%A7%80csr-ssr-ssg-isr%EC%99%80-hydration-%ED%86%BA%EC%95%84%EB%B3%B4%EA%B8%B0 Wed, 26 Aug 2026 11:17:42 GMT Tech notes Notes I put together while studying rendering in ASAP, a study group that meets once a week: the four Next.js rendering methods and Hydration. Image transfer 31MB → 1.2MB: optimizing images with a CDN and srcset https://umsungjun.com/en/blog/%EC%9D%B4%EB%AF%B8%EC%A7%80-%EC%A0%84%EC%86%A1%EB%9F%89-31mb-12mb-cdn%EA%B3%BC-srcset%EC%9C%BC%EB%A1%9C-%EC%9D%B4%EB%AF%B8%EC%A7%80-%EC%B5%9C%EC%A0%81%ED%99%94%ED%95%98%EA%B8%B0 https://umsungjun.com/en/blog/%EC%9D%B4%EB%AF%B8%EC%A7%80-%EC%A0%84%EC%86%A1%EB%9F%89-31mb-12mb-cdn%EA%B3%BC-srcset%EC%9C%BC%EB%A1%9C-%EC%9D%B4%EB%AF%B8%EC%A7%80-%EC%B5%9C%EC%A0%81%ED%99%94%ED%95%98%EA%B8%B0 Wed, 12 Aug 2026 11:24:24 GMT Work I applied Akamai Image Manager to the image resources of WiniLogis and Autowini so that image format conversion and resizing are handled by the CDN. Splitting React Core Libraries and Applying Akamai CDN Caching https://umsungjun.com/en/blog/react-core-%EB%9D%BC%EC%9D%B4%EB%B8%8C%EB%9F%AC%EB%A6%AC-%EB%B6%84%EB%A6%AC%EC%99%80-akamai-cdn-%EC%BA%90%EC%8B%9C-%EC%A0%81%EC%9A%A9 https://umsungjun.com/en/blog/react-core-%EB%9D%BC%EC%9D%B4%EB%B8%8C%EB%9F%AC%EB%A6%AC-%EB%B6%84%EB%A6%AC%EC%99%80-akamai-cdn-%EC%BA%90%EC%8B%9C-%EC%A0%81%EC%9A%A9 Wed, 29 Jul 2026 11:06:02 GMT Work To optimize performance in a React project, I split the React core libraries into a separate bundle called react-vendor. Why Images Did Not Update After Deploy, and Applying Cache Busting https://umsungjun.com/en/blog/%EB%B0%B0%ED%8F%AC-%ED%9B%84-%EB%B3%80%EA%B2%BD%EB%90%98%EC%A7%80-%EC%95%8A%EB%8A%94-%EC%9D%B4%EB%AF%B8%EC%A7%80%EC%9D%98-%EC%9B%90%EC%9D%B8-%EB%B6%84%EC%84%9D%EA%B3%BC-%EC%BA%90%EC%8B%9C-%EB%B2%84%EC%8A%A4%ED%8C%85-%EC%A0%81%EC%9A%A9 https://umsungjun.com/en/blog/%EB%B0%B0%ED%8F%AC-%ED%9B%84-%EB%B3%80%EA%B2%BD%EB%90%98%EC%A7%80-%EC%95%8A%EB%8A%94-%EC%9D%B4%EB%AF%B8%EC%A7%80%EC%9D%98-%EC%9B%90%EC%9D%B8-%EB%B6%84%EC%84%9D%EA%B3%BC-%EC%BA%90%EC%8B%9C-%EB%B2%84%EC%8A%A4%ED%8C%85-%EC%A0%81%EC%9A%A9 Thu, 23 Jul 2026 11:37:06 GMT Work I replaced an image and deployed, but users kept seeing the old one. Refreshing the browser did not help, and other PCs also showed the old image for a while. Improving infinite scroll search list state management with useInfiniteQuery https://umsungjun.com/en/blog/useinfinitequery%EB%A1%9C-%EB%AC%B4%ED%95%9C%EC%8A%A4%ED%81%AC%EB%A1%A4-%EA%B2%80%EC%83%89-%EB%A6%AC%EC%8A%A4%ED%8A%B8-%EC%83%81%ED%83%9C-%EA%B4%80%EB%A6%AC-%EA%B0%9C%EC%84%A0 https://umsungjun.com/en/blog/useinfinitequery%EB%A1%9C-%EB%AC%B4%ED%95%9C%EC%8A%A4%ED%81%AC%EB%A1%A4-%EA%B2%80%EC%83%89-%EB%A6%AC%EC%8A%A4%ED%8A%B8-%EC%83%81%ED%83%9C-%EA%B4%80%EB%A6%AC-%EA%B0%9C%EC%84%A0 Fri, 03 Jul 2026 11:56:22 GMT Work The Autowini unified search page shows a More search results button when there is a next page, and pressing it appends the next page of results. An alternative to removing related videos in a YouTube iframe https://umsungjun.com/en/blog/youtube-iframe-%EA%B4%80%EB%A0%A8-%EC%98%81%EC%83%81-%EC%A0%9C%EA%B1%B0-%EB%8C%80%EC%B2%B4-%EB%B0%A9%EB%B2%95 https://umsungjun.com/en/blog/youtube-iframe-%EA%B4%80%EB%A0%A8-%EC%98%81%EC%83%81-%EC%A0%9C%EA%B1%B0-%EB%8C%80%EC%B2%B4-%EB%B0%A9%EB%B2%95 Tue, 28 Apr 2026 11:59:30 GMT Work The WiniLogis Ocean Freight detail page was playing a YouTube video through an iframe. Autowini WEB Integration Project: Playwright E2E Tests + Claude Code Automation https://umsungjun.com/en/blog/autowini-web-%ED%86%B5%ED%95%A9-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-playwright-e2e-%ED%85%8C%EC%8A%A4%ED%8A%B8-%EB%8F%84%EC%9E%85-claude-code-%EC%9E%90%EB%8F%99%ED%99%94 https://umsungjun.com/en/blog/autowini-web-%ED%86%B5%ED%95%A9-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-playwright-e2e-%ED%85%8C%EC%8A%A4%ED%8A%B8-%EB%8F%84%EC%9E%85-claude-code-%EC%9E%90%EB%8F%99%ED%99%94 Mon, 20 Apr 2026 11:54:12 GMT Work In my previous post, I added Vitest and set up a unit testing environment for utility functions. Fixing Page Transition Flicker (White Screen) When Using React Lazy + Suspense https://umsungjun.com/en/blog/react-lazy-suspense-%EC%82%AC%EC%9A%A9-%EC%8B%9C-%ED%8E%98%EC%9D%B4%EC%A7%80-%EC%A0%84%ED%99%98-%EA%B9%9C%EB%B9%A1%EC%9E%84%ED%9D%B0-%ED%99%94%EB%A9%B4-%EB%AC%B8%EC%A0%9C-%ED%95%B4%EA%B2%B0 https://umsungjun.com/en/blog/react-lazy-suspense-%EC%82%AC%EC%9A%A9-%EC%8B%9C-%ED%8E%98%EC%9D%B4%EC%A7%80-%EC%A0%84%ED%99%98-%EA%B9%9C%EB%B9%A1%EC%9E%84%ED%9D%B0-%ED%99%94%EB%A9%B4-%EB%AC%B8%EC%A0%9C-%ED%95%B4%EA%B2%B0 Mon, 23 Mar 2026 11:15:40 GMT Work While optimizing the performance of the WiniLogis project earlier, I applied code splitting. Android WebView debugging: fixing the chrome://inspect Pending authentication error https://umsungjun.com/en/blog/android-webview-%EB%94%94%EB%B2%84%EA%B9%85-chromeinspect-pending-authentication-%EC%98%A4%EB%A5%98-%ED%95%B4%EA%B2%B0 https://umsungjun.com/en/blog/android-webview-%EB%94%94%EB%B2%84%EA%B9%85-chromeinspect-pending-authentication-%EC%98%A4%EB%A5%98-%ED%95%B4%EA%B2%B0 Thu, 12 Mar 2026 11:25:01 GMT Work I recently had to check a problem with a page shown in a WebView inside a native Android app. Frontend Kit: Adding an AI Chat Feature with Gemma 3 27B https://umsungjun.com/en/blog/frontend-kit-ai-%EB%AC%B8%EB%8B%B5-%EA%B8%B0%EB%8A%A5-%EB%8F%84%EC%9E%85-gemma-3-27b https://umsungjun.com/en/blog/frontend-kit-ai-%EB%AC%B8%EB%8B%B5-%EA%B8%B0%EB%8A%A5-%EB%8F%84%EC%9E%85-gemma-3-27b Fri, 27 Feb 2026 07:50:19 GMT Projects Frontend Kit is a PWA web app for studying frontend interview questions as flashcards. Here is how I added an in-app AI chat with Gemma 3 27B. Migrating WiniLogis from Webpack to Vite https://umsungjun.com/en/blog/winilogis-webpack%EC%97%90%EC%84%9C-vite%EB%A1%9C-%EB%A7%88%EC%9D%B4%EA%B7%B8%EB%A0%88%EC%9D%B4%EC%85%98 https://umsungjun.com/en/blog/winilogis-webpack%EC%97%90%EC%84%9C-vite%EB%A1%9C-%EB%A7%88%EC%9D%B4%EA%B7%B8%EB%A0%88%EC%9D%B4%EC%85%98 Tue, 10 Feb 2026 11:44:33 GMT Work While working on the WiniLogis project, I noticed that its dev environment took 39 seconds to start, much slower than the company's other Vite-based projects. Building a React-based Keycloak theme and i18n with Keycloakify https://umsungjun.com/en/blog/keycloakify%EB%A5%BC-%ED%99%9C%EC%9A%A9%ED%95%9C-react-%EA%B8%B0%EB%B0%98-keycloak-%ED%85%8C%EB%A7%88-%EA%B0%9C%EB%B0%9C-%EB%B0%8F-%EB%8B%A4%EA%B5%AD%EC%96%B4-%EC%B2%98%EB%A6%AC https://umsungjun.com/en/blog/keycloakify%EB%A5%BC-%ED%99%9C%EC%9A%A9%ED%95%9C-react-%EA%B8%B0%EB%B0%98-keycloak-%ED%85%8C%EB%A7%88-%EA%B0%9C%EB%B0%9C-%EB%B0%8F-%EB%8B%A4%EA%B5%AD%EC%96%B4-%EC%B2%98%EB%A6%AC Mon, 09 Feb 2026 11:05:15 GMT Work While introducing Keycloak to the Autowini service, I customized the login screen with Keycloakify and added support for 15 languages. Lighthouse in the 90s but still feels slow? Fixed with the Vercel region https://umsungjun.com/en/blog/lighthouse-90%EC%A0%90%EB%8C%80%EC%9D%B8%EB%8D%B0-%EC%B2%B4%EA%B0%90%EC%9D%80-%EB%8A%90%EB%A6%B0-%EC%9D%B4%EC%9C%A0-vercel-region-%EC%B5%9C%EC%A0%81%ED%99%94%EB%A1%9C-%ED%95%B4%EA%B2%B0%ED%95%98%EA%B8%B0 https://umsungjun.com/en/blog/lighthouse-90%EC%A0%90%EB%8C%80%EC%9D%B8%EB%8D%B0-%EC%B2%B4%EA%B0%90%EC%9D%80-%EB%8A%90%EB%A6%B0-%EC%9D%B4%EC%9C%A0-vercel-region-%EC%B5%9C%EC%A0%81%ED%99%94%EB%A1%9C-%ED%95%B4%EA%B2%B0%ED%95%98%EA%B8%B0 Tue, 03 Feb 2026 11:16:40 GMT Work My portfolio project is currently built on Next.js and Supabase, and it is deployed and managed through Vercel. Building CI/CD for Autowini's Frontend on Bitbucket, Part 2 https://umsungjun.com/en/blog/autowini-%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C-%EB%B6%84%EB%A6%AC-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-cicd-%ED%8C%8C%EC%9D%B4%ED%94%84%EB%9D%BC%EC%9D%B8-%EA%B5%AC%EC%B6%95-bitbucket-%EA%B8%B0%EB%B0%98-2 https://umsungjun.com/en/blog/autowini-%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C-%EB%B6%84%EB%A6%AC-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-cicd-%ED%8C%8C%EC%9D%B4%ED%94%84%EB%9D%BC%EC%9D%B8-%EA%B5%AC%EC%B6%95-bitbucket-%EA%B8%B0%EB%B0%98-2 Mon, 19 Jan 2026 11:05:43 GMT Work At Autowini, most of our frontend projects are now separated out and run on React. Menus Collapsing on Filter Change, Fixed with TanStack Query placeholderData https://umsungjun.com/en/blog/%ED%95%84%ED%84%B0-%EB%B3%80%EA%B2%BD-%EC%8B%9C-%EB%A9%94%EB%89%B4%EA%B0%80-%EC%A0%91%ED%9E%88%EB%8D%98-%EB%AC%B8%EC%A0%9C-tanstack-query-placeholderdata%EB%A1%9C-%ED%95%B4%EA%B2%B0%ED%95%9C-%EB%B0%A9%EB%B2%95 https://umsungjun.com/en/blog/%ED%95%84%ED%84%B0-%EB%B3%80%EA%B2%BD-%EC%8B%9C-%EB%A9%94%EB%89%B4%EA%B0%80-%EC%A0%91%ED%9E%88%EB%8D%98-%EB%AC%B8%EC%A0%9C-tanstack-query-placeholderdata%EB%A1%9C-%ED%95%B4%EA%B2%B0%ED%95%9C-%EB%B0%A9%EB%B2%95 Thu, 15 Jan 2026 10:25:33 GMT Work A UX problem in the left Accordion menu of the Autowini filter search page led me to improve its structure with TanStack Query's placeholderData option. Fixing duplicate meta tags in a React SPA by building a library (feat. react-head-safe) https://umsungjun.com/en/blog/react-spa%EC%97%90%EC%84%9C-%EB%A9%94%ED%83%80-%ED%83%9C%EA%B7%B8-%EC%A4%91%EB%B3%B5-%EB%AC%B8%EC%A0%9C-%EB%9D%BC%EC%9D%B4%EB%B8%8C%EB%9F%AC%EB%A6%AC-%EC%A0%9C%EC%9E%91%EC%9C%BC%EB%A1%9C-%ED%95%B4%EA%B2%B0%ED%95%98%EA%B8%B0-feat-react-head-safe https://umsungjun.com/en/blog/react-spa%EC%97%90%EC%84%9C-%EB%A9%94%ED%83%80-%ED%83%9C%EA%B7%B8-%EC%A4%91%EB%B3%B5-%EB%AC%B8%EC%A0%9C-%EB%9D%BC%EC%9D%B4%EB%B8%8C%EB%9F%AC%EB%A6%AC-%EC%A0%9C%EC%9E%91%EC%9C%BC%EB%A1%9C-%ED%95%B4%EA%B2%B0%ED%95%98%EA%B8%B0-feat-react-head-safe Fri, 09 Jan 2026 09:39:20 GMT Work While running a real service, I found that the initial meta tags defined in index.html and the meta tags created on page navigation were duplicated. React i18n Build Size Optimization 2: Splitting Translations by Page https://umsungjun.com/en/blog/react-i18n-%EB%8B%A4%EA%B5%AD%EC%96%B4-%EC%B2%98%EB%A6%AC-%EB%B9%8C%EB%93%9C-%ED%81%AC%EA%B8%B0-%EC%B5%9C%EC%A0%81%ED%99%94-2 https://umsungjun.com/en/blog/react-i18n-%EB%8B%A4%EA%B5%AD%EC%96%B4-%EC%B2%98%EB%A6%AC-%EB%B9%8C%EB%93%9C-%ED%81%AC%EA%B8%B0-%EC%B5%9C%EC%A0%81%ED%99%94-2 Tue, 30 Dec 2025 11:25:44 GMT Work This continues my earlier post, React i18n Build Size Optimization 1. This time I split the translations by page so each page loads only what it needs. Building CI/CD for Autowini's Frontend on Bitbucket, Part 1 https://umsungjun.com/en/blog/autowini-%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C-%EB%B6%84%EB%A6%AC-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-cicd-%ED%8C%8C%EC%9D%B4%ED%94%84%EB%9D%BC%EC%9D%B8-%EA%B5%AC%EC%B6%95-bitbucket-%EA%B8%B0%EB%B0%98 https://umsungjun.com/en/blog/autowini-%ED%94%84%EB%A1%A0%ED%8A%B8%EC%97%94%EB%93%9C-%EB%B6%84%EB%A6%AC-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-cicd-%ED%8C%8C%EC%9D%B4%ED%94%84%EB%9D%BC%EC%9D%B8-%EA%B5%AC%EC%B6%95-bitbucket-%EA%B8%B0%EB%B0%98 Thu, 27 Nov 2025 11:00:40 GMT Work Autowini has several frontend projects that we separated out and improved in React. Removing Unused Translation Keys with GitHub Copilot https://umsungjun.com/en/blog/github-copilot%EC%9D%84-%ED%99%9C%EC%9A%A9%ED%95%9C-%EC%82%AC%EC%9A%A9%ED%95%98%EC%A7%80-%EC%95%8A%EB%8A%94-%EB%B2%88%EC%97%AD-%ED%82%A4-%EC%A0%9C%EA%B1%B0 https://umsungjun.com/en/blog/github-copilot%EC%9D%84-%ED%99%9C%EC%9A%A9%ED%95%9C-%EC%82%AC%EC%9A%A9%ED%95%98%EC%A7%80-%EC%95%8A%EB%8A%94-%EB%B2%88%EC%97%AD-%ED%82%A4-%EC%A0%9C%EA%B1%B0 Thu, 13 Nov 2025 11:02:17 GMT Work When managing multiple languages (i18n) in a project, unused translation keys are left behind every time a feature is changed or removed. Adding a Vitest test system to the Autowini WEB integration project https://umsungjun.com/en/blog/autowini-web-%ED%86%B5%ED%95%A9-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-vitest-%ED%85%8C%EC%8A%A4%ED%8A%B8-%EC%8B%9C%EC%8A%A4%ED%85%9C-%EB%8F%84%EC%9E%85 https://umsungjun.com/en/blog/autowini-web-%ED%86%B5%ED%95%A9-%ED%94%84%EB%A1%9C%EC%A0%9D%ED%8A%B8-vitest-%ED%85%8C%EC%8A%A4%ED%8A%B8-%EC%8B%9C%EC%8A%A4%ED%85%9C-%EB%8F%84%EC%9E%85 Fri, 17 Oct 2025 06:11:04 GMT Work web-www-front is an integration project at Autowini, created to separate the existing JSP-based legacy pages into React and improve them.