본문 바로가기

전체 글42

JPEG 손실 압축 JPEG은 손실 압축 방식으로 압축을 수행한다. 어떤 원리로 압축이 수행되는지 알아보자. 1. Color Space Conversion2. Chrominance Downsampling3. Discrete Cosine Transform4. Quantization5. Run Length and Huffman Encoding 인간의 눈은 완벽하지 않다. JPEG은 인간이 알아차리지 못하는 정보를 지움으로써 압축을 한다.  RodsConesBrightness & Low light sensitiveColor sensitive100 million6 million 밝기를 감지하는 Rods가 색깔을 감지하는 Cones보다 훨씬 많다. 그래서 우리 눈은 밝기에 더 민감하다.STEP 1: Color Space Conver.. 2025. 1. 27.
WebView: 나빼고 다 쓰고있었잖아? 목차1. 웹뷰 이해하기2. 네이티브 웹뷰 인터렉션3. 웹뷰 장단점1. 웹뷰 이해하기1.1. 웹뷰란?웹뷰는 모바일 앱 내에서 웹 콘텐츠를 렌더링할 수 있는 임베디드 브라우저로, 부분적인 UI를 그리는 데에 사용할 수 있는 기술이다. 각 웹뷰는 독립적인 실행 환경을 가지며, 세션, 쿠키, 로컬 스토리지가 웹뷰별로 분리되어 관리된다. 이를 활용하면 하나의 모바일 앱을 여러 작은 앱들로 나누어 개발할 수 있고, 각 웹뷰마다 별도의 Git 레포지토리를 운영하여 각 팀이 원하는 시점에 독립적으로 배포할 수 있다. 예를 들어, 앱 내 광고는 대부분 웹뷰로 구현되고, 하이브리드 앱에서는 웹뷰와 네이티브 컴포넌트가 밀접하게 통합되어 어떤 부분이 웹뷰이고 어떤 부분이 네이티브인지 구분하기 어려운 경우도 많다. 1.2. .. 2025. 1. 15.
2024.zip #TaskStock #피로그래밍 #타블로그 #디즤코드 #DDD #폴라보 #틩 #우타코 #Aboutme #Spotify #당근 #우테코 왜 벌써 2025년이지..? 25학번이 들어온다고..? 근데 06년생이라고..?1월~2월#TaskStock #피로그래밍 마무리  TaskStock 한 게 올해였다고? 라는 생각이 들 정도로 오래전 일처럼 느껴진다. 이땐 정말 이걸로 취직할 줄 알았지...Django로 만들어진 웹 버전을 React Native로 마이그레이션 하면서 기획에 대해 많이 고민해 보고, 유저 플로우 차트도 처음부터 제대로 짜보고, 디자이너를 모셔와서 개발자-디자이너 협업도 처음 경험해 봤다. 프로젝트와 프로덕트의 차이에 대해 고민해 보고, 앱스토어 배포까지 진행하면서 나름대로 배운 것도 많고 꽤 .. 2024. 12. 31.
[POLABO] 온보딩 튜토리얼 공통 컴포넌트 만들기 목차1. 프롤로그2. UI 설계: div에 구멍을 뚫을 수는 없나?3. 유연한 공통 컴포넌트를 위한 Compound component 패턴4. 여러 페이지에서 독립적인 상태 관리하기5. 마치면서1. 프롤로그1.1. Polabo에서 튜토리얼을 도입하게 된 배경서비스를 사용할 때 제작자가 의도한 flow대로 기능을 사용하게 하려면, 사용자가 UX를 직관적으로 이해할 수 있어야 한다. 하지만 우리가 아무리 쉽게 만들었다고 해도, 사용자들이 우리 의도대로 모든 기능을 꼼꼼히 써주는 경우는 드물다.Polabo 프로젝트에서도 유저 반응 테스트를 진행한 결과, 예상과 달리 많은 사용자가 특정 기능의 존재조차 모르는 경우가 있었다. 예를 들어, 폴라로이드 사진을 클릭하면 크게 볼 수 있는 기능이 있는데, 이를 알지 못.. 2024. 12. 22.
GraphQL 적응기 - RESTful 마인드셋에서 벗어나기 위한 몸부림 목차1. 공부한 바에 의하면요.. 2. 지금까지 GraphQL을 RESTful하게 쓰고 있었어요    - 네이밍도 GraphQL스럽게     - Single Query Pattern (같은 Node 타입에 여러 쿼리를 쓰고 있진 않나요)3. GraphQL의 데이터는 '그래프'이다 (Resolver Chaining, Field-based 설계)4. GraphQL 프로젝트 중간 회고5. 마치면서 1. 공부한 바에 의하면요.. 며칠 전에 유튜브를 돌아다니다가 영상을 하나 발견했다. Apollo Client의 maintainer로 일하고 있는 Lenz와의 인터뷰 영상이었는데, 여기서 원래 Apollo Client에 Suspense 기능이 도입된 설명을 들으려고 했다. 그런데 영상 초반에 GraphQL에 대해 간.. 2024. 12. 7.
Optimization(1): Throttle & Debounce 목차- 소개- ResizablePanel: Observer 패턴 + Throttle- Player: Debounce로 효율적인 이벤트 처리- Search: 사용자 입력에 최적화된 Debounce0.  소개현재 진행중인 프로젝트는 Spotify에 가사 퀴즈 기능을 추가한 애플리케이션이다. 이번 프로젝트에서는 Frontend에서 다양한 최적화 기법들을 적용해 봤는데, 이것들을 시리즈로 정리해보려고 한다. 이번 글은 이 시리즈의 첫 번째 글로, 프로젝트 곳곳에 적용된 Debounce와 Throttle 기법을 다뤄보고자 한다. Optimization Series (업데이트 시 링크 추가 예정)(1) Debounce & Throttle(2) Caching strategy(3) Optimistic update us.. 2024. 12. 5.