모든 블로그
펫프렌즈

펫프렌즈

주요 카테고리 백엔드 · 프론트엔드 · DevOps

활동 요약

대표 인기 포스트프론트엔드 테스트 비용과 효용 사이에서188 조회
최근 30일
1개
평균 조회
78
누적 조회
2,111
전체 글
27개
마지막 발행
2026. 11. 11.
블로그 방문

펫프렌즈 기술 블로그 글 (8)

프론트엔드

Next.js에서 QueryClient를 전역변수로 사용해도 될까요?

Next.js SSR에서 전역 QueryClient를 공유하면 요청 데이터가 누적되어 메모리 누수가 발생했습니다. 요청마다 QueryClient를 분리해 GC가 회수할 수 있도록 개선했습니다.

#Next.js#TanStack Query#SSR
17400

프론트엔드

App Store 5.1.1 가이드라인 리젝 대응기: SwiftUI Repository 패턴으로 게스트 기능 구현하기

App Store 5.1.1 리젝을 계기로 SwiftUI 앱에 게스트 모드를 설계하고 Repository 패턴과 DI Container를 도입했습니다. Mock 데이터와 화면 분리를 통해 유지보수성과 확장성을 함께 확보했습니다.

#SwiftUI#Repository#DI
4700

프론트엔드

프론트엔드 테스트 비용과 효용 사이에서

프론트엔드 테스트의 비용과 효용을 배송 정보 렌더링 사례로 살펴본 글입니다. 테스트 기준 시각 고정, 공통화, 순서 검증으로 커버리지를 높인 과정을 정리했습니다.

#test#refactoring#Jest
18800

프론트엔드

Playwright로 로그인을, Lighthouse로 성능을: 인증 페이지 성능측정 자동화

Playwright로 로그인 세션을 자동 구성한 뒤 Lighthouse를 실행해 인증 페이지 성능 측정을 자동화했습니다. 수집한 지표는 CloudWatch와 Grafana로 연동해 지속적으로 모니터링할 수 있게 했습니다.

#Playwright#Lighthouse#CI/CD
12700

프론트엔드

iOS 앱개발자가 Appium으로 구현해본 웹뷰 테스팅

iOS 앱 개발자가 Appium으로 웹뷰 UI 테스트를 구현한 과정과 장단점을 정리했습니다. 환경 설정, 시나리오 작성, 트러블슈팅과 협업 포인트까지 함께 공유했습니다.

#iOS#Appium#웹뷰
6700

프론트엔드

웹 성능 측정 자동화 비법: Lighthouse CI와 CI/CD의 만남

Lighthouse CI를 CI/CD에 통합해 배포 후 웹 성능 측정을 자동화한 사례를 소개했습니다. 반복 측정, S3 저장, Slack 알림으로 성능 모니터링과 공유를 체계화했습니다.

#CI/CD#Lighthouse#GitHub Actions
4200

프론트엔드

테크니컬 라이팅으로 시작해보는 기술블로그 작성법

기술 블로그를 쉽게 쓰기 위한 테크니컬 라이팅 원칙과 작성 순서를 정리했습니다. 목적과 독자를 먼저 정하고 구조화, 초안, 검토를 반복하라고 제안했습니다.

#iOS#문서화#기술 블로그
3600

프론트엔드

목록 가상화의 마법 “우리 DOM이 달라졌어요”

무한 스크롤 피드에서 DOM 증가로 인한 성능 저하를 해결하기 위해 가상화를 도입했습니다. 동적 높이와 스크롤 복원을 고려해 react-virtuoso를 선택하고 직접 복원 로직도 구현했습니다.

#React#Next.js#virtualization
2700