프론트엔드 뉴스레터
#27
이번 이슈 한눈에
- 프랑스 하원이 콘텐츠 전송량에 과세하는 예산 수정안을 가결했어요. 아직 확정 법률은 아닙니다.
- ChatGPT에서 격리된 미리보기의 메시지로 비공개 대화에 접근한 연구가 공개됐어요.
- 같은 앱을 AI로 구현해도 프레임워크와 문서 탐색에 따라 비용이 달랐어요.
- 01
news.hada.io
프랑스 하원, 콘텐츠 전송량에 과세하는 예산 수정안을 가결했어요
원문 읽기 ↗프랑스 하원이 10월 30일, 프랑스 이용자에게 보낸 데이터에 GB당 0.055유로를 부과하는 2027년 예산 수정안을 가결했어요. 납세 대상은 콘텐츠를 전송한 사업자이며, 인터넷 접속 업체가 전송량을 측정해 세무당국에 보고하도록 했습니다. 아직 확정된 법률은 아니며, 남은 예산안 심의에서 바뀌거나 삭제될 수 있어요.
- CDN을 쓰면 CDN에서 이용자 쪽으로 나간 전송량을 합산하도록 했어요.
- 세액 상한은 프랑스 매출의 15% 또는 전체 매출의 2%로 명시했습니다.
- 02
news.hada.io
ChatGPT 공유 링크로 미리보기의 격리를 우회할 수 있었어요
원문 읽기 ↗보안업체 Parameter가 ChatGPT 공유 링크로 다른 계정의 비공개 대화를 읽는 취약점을 재현했어요. 별도 origin에 격리된 HTML 미리보기에서 보낸
postMessage를 부모 페이지의 수식 입력 라이브러리 MathLive가 발신자 확인 없이 받은 겁니다.이 메시지로 부모 페이지에 HTML을 삽입한 뒤,
sandbox없는 새iframe과 스크립트 출처를 제한하는 CSP의 우회를 거쳐 로그인한 사용자의 권한으로 코드를 실행했어요. OpenAI는 10월 26일 두 웹 프론트엔드 모두 해당 메시지를 거부하도록 수정했습니다.- 자동 미리보기를 사용한 재현에서는 공유 링크를 여는 것만으로 실행됐어요. 공개된 내용은 연구진의 재현 결과입니다.
- 03
nolanlawson.com
같은 앱을 AI로 구현하고 프레임워크별 비용을 비교했어요
원문 읽기 ↗Nolan Lawson이 AI 모델 Opus 5.5의 high effort 설정으로 같은 목록·검색 앱을 12가지 프레임워크·도구 조합에서 만들게 했어요. API 요금으로 환산한 실행당 비용 중앙값은 Hono+htmx 2.67달러, Next.js 3.14달러였지만 실행별 비용 범위는 겹쳤습니다. SvelteKit에서는 매번 새 버전의 migration guide를 읽었고, 익숙하지 않은 Gracile에서는 소스까지 읽은 점이 비용을 높였을 가능성을 짚었어요.
- 조합별로 5번씩 실행했고, Angular는 두 번 실패해 성공한 3번만 집계했어요. 상호작용이 적은 콘텐츠 중심 앱 한 종류를 대상으로 한 결과입니다.
- 04
news.hada.io
Prospero, 명령을 중단하면 빌드의 자식 프로세스까지 종료해요
원문 읽기 ↗새로 공개된 코딩 도구 Prospero는 AI가 실행한 shell 명령의 대기 시간이 지나면 작업을 백그라운드로 옮겨, 에이전트가 계속 기다릴지 다시 판단하게 해요. 명령을 중단하면 빌드의 자식 프로세스까지 함께 종료합니다. Windows, macOS, Linux에서 실행하는 네이티브 앱이에요.
- 모델은 로컬 서버나 별도 API로 연결해야 하며, Claude 구독을 연결해 쓸 수는 없어요.
- 05
github.com
react-window 2.5, 목록을 페이지와 함께 스크롤할 수 있어요
원문 읽기 ↗화면에 보이는 항목만 렌더링하는 react-window가 2.5에서
scrollElement를 추가했어요.List나Grid에"window"또는 스크롤되는 상위 요소를 지정하면, 목록 안에 별도 스크롤 영역을 만들지 않고 페이지의 다른 콘텐츠와 함께 움직입니다. 앞쪽 이미지가 늦게 로드돼 목록 위치가 밀려도 다시 측정해요. 새useVirtualizer()는 렌더링할 항목과 위치·크기를 돌려주므로, 직접 만든table에도 가상화를 적용할 수 있습니다.