스트리밍 서비스 최적화를 위한 Chrome Extension 개발기 (StreamLite)

YouTube는 다양한 추천 영상, 댓글, Shorts, 라이브 채팅 등 많은 UI 요소를 제공하지만 사용 목적에 따라서는 이러한 요소들이 오히려 집중도를 떨어뜨리고 페이지 성능에도 영향을 줄 수 있다.

그래서 이번 프로젝트에서는 YouTube 페이지를 단순화하고 성능을 개선하는 Chrome 확장 프로그램 StreamLite를 개발하였다.

메인화면

---

프로젝트 목표

이 확장 프로그램의 최초 목표는 크게 두 가지였다.

1. YouTube 페이지에서 불필요한 요소 제거
2. 페이지 성능 변화를 사용자에게 시각적으로 제공

즉, 단순한 UI 제거 확장이 아니라 성능 개선 효과까지 확인할 수 있는 확장 프로그램을 목표로 했다.

그런데 왜 YoutubeLite가 아니라 StreamLite냐?

최초 목표는 Youtube에 대한 개선이고 추후 릴리즈를 통해 Netflix, Disneyplus, Twitch 등 스트리밍 플랫폼에 대한 성능 개선까지 확장할 예정으로 명칭을 지었다.

---

주요 기능

1️⃣ YouTube UI 최적화

사용자가 선택적으로 다음 요소들을 제거할 수 있도록 구현하였다.

• 추천 영상
• 댓글
• Shorts
• 라이브 채팅

사용자가 설정을 변경하면 해당 설정이 즉시 적용되며, 비활성화 시에는 페이지 새로고침을 통해 정상적으로 복구된다.

---

2️⃣ Performance Monitor

 

페이지 성능 변화를 확인할 수 있도록 성능 모니터링 기능을 추가하였다.

수집 데이터

• Memory Usage
• CPU Usage
• DOM Nodes

이 데이터를 기반으로 실시간 그래프를 표시한다.

---

3️⃣ Performance Score

 

단순한 수치 대신 직관적인 성능 점수를 제공한다.

 

Score 계산 기준

Memory 40%
CPU 40%
DOM Nodes 20%

 

점수 상태

80 ~ 100  Good
40 ~ 79   Normal
0 ~ 39    Heavy

이를 통해 사용자는 현재 페이지 상태를 쉽게 이해할 수 있다.

---

4️⃣ Optimization Impact 분석

 

최적화 기능 적용 전후의 성능 변화를 분석하여 성능 개선 효과를 사용자에게 보여준다.

 

예시

Performance Improvement

Page Elements Reduced   ↓ 32%
Memory Usage Reduced    ↓ 18%

 

---

5️⃣ YouTube 페이지 자동 감지

 

확장 프로그램은 현재 페이지가 YouTube인지 자동으로 감지한다.

 

UI 표시

🟢 YouTube ✅
⚪ YouTube ❌

 

또한 최적화 기능이 활성화되었는지도 함께 표시한다.

🟢 Optimization ✅
⚪ Optimization ❌

---

다국어 지원

사용 편의성을 위해 다국어 지원 시스템도 구현하였다.

지원 언어

• 한국어
• English

Chrome Extension의 _locales 구조를 사용하여 구현하였다.

_locales
 ├ ko
 │   └ messages.json
 └ en
     └ messages.json

 

---

UI/UX 개선

초기 버전에서는 단순한 설정 UI였지만 Chrome Web Store 수준의 UX를 목표로 다음 요소들을 추가하였다.

• 카드 기반 UI
• 토글 스위치
• 실시간 성능 그래프
• 성능 점수 표시
• 상태 표시 패널

---

 

기술 스택

이번 프로젝트에서 사용한 기술

Chrome Extension (Manifest V3)
JavaScript
Chart.js
HTML / CSS
Chrome Storage API
Chrome Tabs API

 

---

 

 

마무리

이번 프로젝트를 통해

• Chrome Extension 구조 이해
• 브라우저 API 활용
• 사용자 경험(UI/UX) 개선

등 다양한 경험을 할 수 있었다.

StreamLite는 단순한 기능 구현을 넘어 사용자가 성능 변화를 직접 확인할 수 있는 확장 프로그램이라는 점에서 의미 있는 프로젝트였다.

앞으로도 지속적으로 개선해 나갈 예정이다.

---