SDUI로 네이티브 운영 민첩성 높이기
네이티브 앱의 배포 지연을 줄이기 위해 SDUI를 설계하고 도입한 과정을 정리했습니다. 서버 스키마 기반 화면 구성과 성능 최적화, 롤백 전략까지 함께 다뤘습니다.
#Android#iOS
12800
프론트엔드 기술 블로그 최신 글
필터 0
SEO 주도 개발 실천기: 구글이 인정한 ‘좋은 URL’ 99% 달성 여정
SEO 지표를 개발 목표로 삼아 서버와 클라이언트의 병목을 단계적으로 개선했습니다. 그 결과 원티드 플랫폼의 99% URL을 ‘좋은 URL’로 전환했습니다.
#SEO#Next.js
10600
증강현실 기반 마케팅 솔루션 'play AR'을 소개합니다(feat. '춘식이는 홈런왕')
증강현실 기반 마케팅 솔루션 'play AR'을 소개합니다(feat. '춘식이는 홈런왕')
SK플래닛의 Web AR 마케팅 플랫폼 play AR과 전환 배경, 구현 기술을 소개했습니다. 앱 설치 없이 QR 스캔으로 접근성을 높이고 다양한 이벤트 템플릿을 제공했습니다.
#AR#Web AR
4500
Chat DIC - 대화형 LLM 서비스의 프런트엔드 성능 개선기
Chat DIC - 대화형 LLM 서비스의 프런트엔드 성능 개선기
Chat DIC 프런트엔드에서 SSE로 LLM 응답을 실시간 스트리밍하도록 구현했습니다. 버퍼와 Windowing을 적용해 비활성 탭 지연과 긴 대화 성능 저하를 개선했습니다.
#React#JavaScript
14500
여기어때 컬처북 제작기(2) — 디자인편
여기어때는 리더십원칙을 심볼과 일러스트로 재해석해 컬처북으로 제작했습니다. 딱딱한 가이드북 대신 스토리북 형식으로 조직문화를 친근하게 전달했습니다.
#UI/UX#design
7600
포스를 확장하는 가장 빠른 방법, 포스 플러그인
포스 확장을 위해 제휴사별 맞춤 개발 대신 플러그인 구조를 도입한 사례를 소개했습니다. 웹 워커 격리와 SDK 추상화로 안정성과 개발 편의성을 높이고, 향후 생태계 확장을 계획했습니다.
#node.js#JavaScript
10600
AI로 만드는 사용자 중심 테스트 파이프라인 — 비글루 앱인토스 개발 기록
AI로 만드는 사용자 중심 테스트 파이프라인 — 비글루 앱인토스 개발 기록
AI로 Figma 시안부터 User Story·AC·테스트까지 연결하는 사용자 중심 파이프라인을 구성했습니다. UI 근거와 사람의 검수를 결합해 환각을 줄이고 QA 기록도 표준화했습니다.
#User Story#Gherkin
000
강의실 모달 지옥에서 탈출하기: React useFunnel hook 설계
React useFunnel로 강의실 모달의 연쇄 호출과 조건 분기를 선언적 퍼널로 중앙화했습니다. 순차 실행과 유지보수성을 높이고 중첩 퍼널·API 대기 조건도 지원했습니다.
#React#funnel
200
R-tree를 사용한 가까운 마커 찾기 기능 구현과 개선기
지도에서 드래그 중인 마커의 최근접 마커를 찾는 기능을 구현하고, R-tree와 knn으로 탐색을 최적화했습니다. 최적화 후 CPU 사용률이 줄어들어 지도 UI 성능이 개선되었습니다.
#R-tree#React
5200
![[Jetpack Compose — Part 3] Jetpack Compose, 데이터로 성능과 안정성을 증명하다](https://miro.medium.com/v2/resize:fit:1200/1*fzHVp60NQLB9-H8fQYCmrA.png)
[Jetpack Compose — Part 3] Jetpack Compose, 데이터로 성능과 안정성을 증명하다
Jetpack Compose 도입 후 성능 불안을 CPU 프로파일러와 내부 원리 이해로 해결한 사례를 다루었습니다. 상태 분리, remember, 전환 개선으로 스크롤 버벅임과 깜빡임을 줄였습니다.
#Jetpack Compose#Android
9600
기기 없이 앱을 테스트하는 법, 멀티버스가 알려드립니다
가상 기기로 앱 테스트를 쉽게 만들고, 환경 구축과 디버깅 부담을 줄인 사내 플랫폼 멀티버스를 소개했습니다. 다양한 직군이 공통으로 겪는 테스트 불편을 기능으로 풀어낸 사례를 다뤘습니다.
#iOS#test
22100
우아한 디버깅 툴 2부: 좀 더 편하게 일하기 위한 개선들
우아한 디버깅 툴 2부: 좀 더 편하게 일하기 위한 개선들
QA 재현과 기록, 티켓 전달을 자동화해 업무 흐름을 단방향으로 개선했습니다. rrweb 세션 리플레이와 어드민, Network Rewrite로 이슈 처리 효율을 높였습니다.
#QA#rrweb
5000
우아한 디버깅 툴 1부: 웹뷰/웹페이지 원격으로 디버깅하기
우아한 디버깅 툴 1부: 웹뷰/웹페이지 원격으로 디버깅하기
웹뷰·웹페이지 이슈를 당시 DevTools 상태 그대로 원격 재현하는 디버깅 툴을 소개했습니다. Chrome DevTools Protocol과 WebSocket으로 기록·재생하는 구조를 설명했습니다.
#Chrome DevTools Protocol#webview
4800
반복은 줄이고, 가능성을 넓히다: AI 플러그인이 만든 디자인의 새로운 전환
반복적인 프로모션 카드 제작을 줄이기 위해 Figma 플러그인을 개발한 사례입니다. 상품 URL 한 줄로 카드 10장을 약 90초에 생성하며 팀의 업무 방식을 바꿨습니다.
#Figma#Cursor
11600