연산 세션 사이들 사이의 종속성을 DFS, 위상 정렬 등의 알고리즘을 통해 CLI에 테이블, 트리 형태로 나타내는 기능을 추가했습니다.
https://github.com/lablup/backend.ai/pull/886
연산 세션을 종료할 때 해당 세션에 의존하는 세션들을 모두 재귀적으로 제거할 수 있도록 관련 옵션을 추가했습니다.
https://github.com/lablup/backend.ai/pull/893
MLPerf maskrcnn Backend.AI에서의 벤치마킹 트레이닝 로그를 파싱해 pandas, seaborn을 사용하여 시각화 하였습니다.
https://github.com/jopemachine/mlperf-maskrcnn
개발된 지 몇 년이 지나 작동하지 않던 Backend.AI Jail을 strace를 이용한 디버깅으로 default-policy에 allowed list에 일부 파이썬 바이너리에서 호출하는 일부 시스템 콜이 누락되어 생긴 버그인 것을 확인해, Github action을 이용해 seccomp default policy가 업데이트 되도록 자동화 했습니다.
https://github.com/lablup/backend.ai-jail/pull/18
clip-path 속성을 사용해 이미지를 육각형으로 렌더링하고 더 높은 zindex 값을 주는 형태로 구현했습니다.react-spring으로 육각형 내부의 이미지가 변경될 때 새 이미지가 페이드 인 되면서 들어오면서 기존 이미지가 페이드 아웃 되도록 처리했습니다.
Code splitting으로 로딩 성능 30% 개선했습니다.
모든 페이지에서 전체 자바스크립트 모듈을 모두 로드하는 것에서 필요 없는 트래픽 오버헤드이 발생하는 것을 확인한 후, React에서 제공하는 Router 기반의 Code splitting 모듈을 적용해 Lighthouse 퍼포먼스 점수 기준 30%의 성능 향상을 이끌어 냈습니다.
개선 전 벤치마킹 결과
개선 후 벤치마킹 결과
타입 체크 라이브러리에 Lazy loading을 적용해 자바스크립트 실행 시간을 20% 감소시켰습니다.
회사에서 네트워크 입출력 경계에 내부적으로 제작한 Type validator를 사용하고 있었고, 페이지가 로드될 때 마다 모든 스키마에 대해 validator 객체를 생성하는 과정에서 로딩 성능을 크게 감소시키는 것을 확인했습니다. 클로저를 이용한 간단한 코드 변경으로 validate 함수가 처음 평가될 때로 compile 함수의 호출 시점을 변경함으로써, Lighthouse 디폴트 설정 값, 랜딩 페이지를 기준 Unused Javascript 실행 시간을 20% 감소 시켰습니다.
개선 전 벤치마킹 결과
개선 후 벤치마킹 결과
index.html에 script로 붙어 있어 매번 로드되던 일부 서드 파티 스크립트들을 (결제 / 로그인 모듈)을 필요한 페이지에서만 적용하도록 변경했습니다.
랜딩 페이지의 반응형 이미지 (Hero element)에 aspect-ratio 적용해 CLS를 개선하였습니다.
랜딩 페이지에 들어가는 섹션 별로 IntersectionObserver 객체를 만들어 섹션 별 유저가 머물러 있던 시간을 측정해 차트로 보여주는 인사이트 레포트 데모 기능을 구현했습니다.
*react-spring*을 사용해 아래의 블록 애니메이션을 구현했습니다.
hangul.js를 사용해 구현해 자연스러운 한글 검색이 가능하도록 구현했습니다.+more 버튼을 누를 때 마다 10개를 추가로 보여주도록 구현했습니다.
video 엘리먼트로 동영상 플레이어를 만들고, 해당 웹 API를 사용해 재생, 멈춤, progress bar 등 비디오 컨트롤러에 해당하는 부분을 개발하였습니다.
20년 9월까지 미국 산호세에서 해외 인턴십 (ICT 글로벌 인턴십)을 진행하였으며, 해당 인턴십 기간 동안 위 제품의 유지보수를 진행했습니다.
Enertalk은 가정 및 기업을 대상으로 전기 에너지 사용량 및 태양광 에너지 생산량을 Billing 및 차트 데이터 형태로 제공하는 IoT 전자식 전력량계 시스템으로 Encored의 주상품입니다.
react-native 버전 업그레이드
react-native 버전 업그레이드를 시도할 때 여러 이슈에 부딪쳐 새로운 버전의 react-native 프로젝트를 생성하고 Enertalk의 코드 베이스를 옮기는 쪽으로 업그레이드를 진행했습니다.
react-native-navigation ⇒ react-navigation 마이그레이션
사수 분의 react-navigation이 보다 활발하게 유지보수가 진행되고 있다는 판단으로, react-navigation으로 마이그레이션을 맡아 진행했습니다.
redux-thunk ⇒ redux-saga 마이그레이션
redux-saga가 보다 구체적인 비동기 작업 제어가 가능하기 때문에 기존에 redux-thunk로 작성되어 있던 코드를 redux-saga로 마이그레이션 하는 작업을 맡아 진행했습니다.
Enerflow는 Encored에서 새로 준비 중인 Energy storage system(ESS)에 Photovoltaic system(PV)를 결합한 보다 확장된 에너지 생산량 및 사용량 분석 시스템 및 앱의 이름입니다.
해당 제품의 아래 UI 컴포넌트들을 작성하는 역할을 맡아 진행했습니다.
Figma, Zeplin로 작성된 와이어프레임을 보고 UI 컴포넌트들을 구현하는 방식으로 진행했으며, 기획에서 미심쩍은 부분들은 디자이너 분과 telegram으로 상의하며 진행했습니다.
iDERMS는 Spring, JSP 등의 기술 스택을 활용하여 만들어진 인공지능 기반 통합 분산전원 관리시스템 및 홈페이지 입니다.
해당 제품의 영문화 및 다국어 지원 작업을 맡아 주도적으로 진행했습니다.
다국어 지원 작업을 맡았을 때 2000개 이상의 한국어 문자열들이 있었고 이것들이 자바스크립트 파일, jsp 파일, html 등에 같은 파일에 혼재하는 상황이었습니다. html과 jsp 코드에 서로 다른 방식으로 다국어 지원이 적용되어야 했기 때문에 일괄적인 변경이 불가능 했으며, 모든 문자열들을 개발자가 직접 확인하고 작업해야 했습니다.
번역해야 하는 문자열들을 csv 파일에 정리하고, code-replacer 라는 CLI 프로그램을 작성해 정규표현식으로 변경해야 하는 문자열이 나올 때 마다 html인 부분과 jsp에 해당하는 부분을 Interactive CLI를 통해 판단해 변경을 적용하는 식으로 버그 없이 깔끔하게 다국어 지원 소스 코드를 작성할 수 있었습니다.
A Python Interpreter written in Rust
RustPython은 2022 오픈소스 컨트리뷰톤 챌린지 및 마스터 과정에서 멘티로 참가해보게 된, 오픈소스 프로젝트입니다.
아래 활동을 포함하여 다양한 컨트리뷰션을 진행했으며, 해당 프로젝트의 컨트리뷰션을 통해 2022 Hacktoberfest에도 참여하였습니다.
breakpoint 내장 함수를 RustPython으로 포팅했습니다.https://github.com/RustPython/RustPython/pull/4122
https://github.com/RustPython/RustPython/pull/4226
https://github.com/RustPython/RustPython/pull/4199
아래는 비동기 처리(Promise)에 관련된 라이브러리들에 병합된 PR 중 일부입니다.
Timeout a promise after a specified amount of time
https://github.com/sindresorhus/p-timeout/pull/29
https://github.com/sindresorhus/p-timeout/pull/26
Create a promise that can be canceled