과거에는 웹페이지 화면 위에 억지로 레이어를 띄우거나(Content Script 주입), 클릭할 때만 열리는 팝업(Popup)을 사용해야 해서 한계가 많았습니다. 하지만 구글 크롬이 Manifest V3 업데이트와 함께 **Side Panel API**를 공식적으로 지원하면서, 브라우저 우측에 항상 고정되어 있는 확장 프로그램을 아주 깔끔하게 만들 수 있게 되었습니다.

Chrome Side Panel API의 주요 특징

• 항상 유지 (Persistence): 사용자가 다른 탭으로 이동하거나 새로운 탭을 열어도 사이드바가 닫히지 않고 그대로 유지됩니다.

• 충돌 없는 독립적인 공간: 사용자가 보고 있는 웹페이지의 코드(DOM)를 건드리지 않기 때문에, 웹사이트의 디자인이나 스크립트와 충돌할 위험이 없습니다.

• 자유로운 UI 구성: 일반적인 웹 개발과 똑같이 HTML, CSS, JavaScript를 사용하며 React, Vue 같은 프레임워크도 자유롭게 적용할 수 있습니다.

• 컨텍스트 연동: 현재 열려 있는 탭의 URL이나 텍스트 정보를 가져와 사이드바에서 바로 처리하는 기능(예: 현재 페이지 요약, 번역, 단어장 등)을 만들기 좋습니다.

.

.

.

.

.

오오.. 이런 API가 있었다니 사용할 방법이 늘어날 거 같습니다.

우선은 저의 크롬 확장 프로그램들 중 Local-AI-Assistant에 적용시켜보고 있습니다.

기능중 채팅 창을 사이드 패널로 열수 있는 옵션을 제공하고, 요약 버튼을 누르면 열려있는 페이지를 소스째 보내 LLM이 분석하고 판단해서 요약해줍니다.

웹페이지의 이미지를 드래그해서 메세지창에 올려서 보낼수도 있어요!

MCP도구 사용도 구현중인데 LM Studio API를 이용하지 않고서는 해결하기 복잡해 보이네요 ㅠㅠ

https://github.com/DINKIssTyle/DINKIssTyle-Chrome-Extensions

*웹페이지 요약을 사용하기 위해서는 LLM 모델의 최소 컨텍스트를 10000 이상으로 설정해주세요