문성현

안녕하세요, 대규모 서비스 속에서 복잡한 문제를 해결하며 성장해온 개발자 문성현입니다.
문제를 추상화하여 정의하고 해결하는 과정은 힘들고 강한 끈기가 필요하지만, 해결했을 때 얻는 큰 성취감이 저의 원동력입니다.
최근에는 프론트엔드 성능 최적화를 통해 매끄러운 사용자 경험을 제공하는 데 기여하고, 공통 프레임워크화를 통해 코드의 유지보수성과 확장성을 높이는데 주력하고 있습니다. 이를 통해 사용자 경험을 개선하고, 비즈니스 목표에  부합하는 최적의 솔루션을 제시하는 데 집중하고 있습니다.

<ul><li>다양한 문서 포맷(ODF, HTML, PDF)을 DOCX로 변환하는 서버 기능 개발. Libreoffice와 pdf2docx 오픈소스 라이브러리 활용</li><li>Kubernetes 환경에서 영구 볼륨과 PATH 설정을 통해 파드 재가동 시에도 일관된 라이브러리 실행 환경 보장하며 안정성 강화</li><li>QA 문서 호환 테스트 성공률 95%를 달성 및 IITP 과제를 성공적으로 완료하며 안정적이고 확장 가능한 배포 구조 구축</li></ul>

문서 데이터 통합 관리를 위한 다양한 문서 포맷 호환

<ul><li>기존 워드 모듈에서만 사용 가능했던 댓글 기능을 셀 및 포인트 모듈에서도 사용할 수 있도록 공통 프레임워크화</li><li>Typescript Mixin 패턴을 적용해 다양한 객체(슬라이드, 도형 등)에서 댓글 기능을 손쉽게 확장하도록 구현</li><li>Mixin이 적용된 클래스의 타입을 정의해 정적 타입 안정성을 강화하고, 해당 타입에 대해 타입 가드를 정의해 런타임 안정성 확보. 코드의 신뢰성과 유지 보수성 향상</li><li>공통 프레임워크화 과정에서 PPT 발표, Git Wiki, 코드 주석 설명을 통해 각 모듈 담당자들이 쉽고 명확히 이해할 수 있도록 지원하며 프로젝트를 성공적으로 이끌었음</li></ul>

오피스 댓글 기능 공통 프레임워크화

<ul><li>객체 지향 모델 구조에서 MobX 사용 시 메모리 사용량 증가와 성능 저하 문제 해결을 목표로 프로젝트 진행</li><li>MobX의 Observable, Observer, Action 구조를 분석하여 상태 관리 개선</li><li>observable 옵션(deep, shallow, ref 등)에 따른 메모리 사용량 테스트 및 최적화</li><li>Action을 상위 함수에만 설정해 리렌더링 요청을 최적화</li><li>빈 문서 로딩 시 약 20% 메모리 절감 및 성능 개선 달성</li></ul>

MobX 분석을 통한 메모리 및 성능 최적화

<ul><li>오피스 font 초기화 등 시간이 오래 걸리는 비동기 작업들을 fetch 이후로 재배치해 React Suspense의 fallback UI 표시 시간을 최소화</li><li>FCP(First Contentful Paint)와 무관한 라이브러리를 dynamic import로 분리해 초기 로딩 성능 최적화</li><li>라이브러리의 소수 메서드만 사용되는 경우를 분석해, 불필요한 의존성을 제거하고, 필요 메서드만 직접 구현하도록 가이드해 번들 크기를 최적화</li><li>첫 화면 로딩 시간을 5초에서 2초로 단축, 사용자 콘텐츠 접근 속도와 서비스 응답성을 크게 향상</li></ul>

오피스 로딩 성능 개선

<ul><li>대용량 문서 편집 시 워드 페이지 레이아웃으로 인해 브라우저 메인 스레드가 과부하되어 사용자 이벤트 처리 지연 문제가 발생</li><li>자바스크립트의 동시성을 지원하는 브라우저의 이벤트 루프와 태스크 큐를 이용한 레이아웃 최적화 아키텍처 설계 및 구현</li><li>사용자 이벤트에 즉각 반응하며, 대용량 문서에서도 이벤트 처리 지연 없이 매끄러운 UI를 제공해 사용자 경험을 크게 개선</li></ul>

워드 레이아웃 성능 최적화

<ul><li>비정형 문서 데이터를 DB화하고 동시 편집이 가능한 웹 기반 오피스 애플리케이션 개발</li><li>Frontend<ul><li>담당 기능<ul><li>오피스 제품 개발, 성능 최적화, 댓글 기능, 인쇄/썸네일, z-index, 텍스트 검색 기능 설계, 구현 및 유지보수</li></ul></li><li>성능 최적화<ul><li>대용량 워드 문서 편집 시 발생하는 메인 스레드 블로킹 문제를 해결하기 위해 JavaScript 동시성 처리 아키텍처 설계. 이를 통해 끊김 없이 작업할 수 있는 매끄러운 사용자 경험 제공</li><li>MobX의 상태 관리 구조 분석 및 최적화를 통해 빈 문서 로딩시 메모리 사용량 20% 절감</li><li>React Suspense 구조에서 fetch 전에 실행되던 비동기 작업들을 fetch 이후로 재배치, Code Splitting, Tree Shaking을 통해 첫 화면 로딩 시간을 5초에서 2초로 단축</li></ul></li><li>공통 프레임워크화<ul><li>워드 제품의 댓글 기능을 다양한 모듈(워드, 셀, 포인트)에서 공통적으로 사용 가능하도록 리팩토링</li></ul></li></ul></li><li>Backend<ul><li>다양한 문서 포맷 호환 기능 구현 및 배포<ul><li>서버에서 오픈소스 라이브러리를 활용하여 다양한 문서 포맷(ODF, PDF, HTML)을 DOCX로 변환하고, Kubernetes 환경에서 라이브러리 실행 환경 구축</li></ul></li><li>텍스트 검색 서비스 개발<ul><li>PL/SQL 프로시저를 사용하여 문서 데이터 내 텍스트 검색 서비스 구축</li><li>Client에서는 RESTful API를 통해 검색 결과를 받아, 문서상의 순서대로 정렬해 관리</li></ul></li></ul></li></ul>