ChatGPT + DevSpace 긴 대화가 RAM을 먹어치울 때, Tampermonkey로 버텨낸 기록

스마트폰에서 ChatGPT 열기
        ↓
작업 지시
        ↓
DevSpace가 집/사무실 Mac의 실제 저장소 접근
        ↓
코드 수정 / 테스트 / Git 작업
        ↓
스마트폰에서 결과 확인

// ==UserScript==
// @name         ChatGPT RAM Saver v5.0 (Total Memory Purge)
// @namespace    http://tampermonkey.net
// @version      5.0
// @description  iframe뿐 아니라 SVG, 이미지, 코드블록, 이벤트리스너, 애니메이션까지 전부 정리하여 ChatGPT RAM을 극한까지 절약합니다.
// @author       You
// @match        https://chatgpt.com/*
// @grant        none
// @run-at       document-end
// ==/UserScript==
 
(function() {
    'use strict';
 
    // ─── 상태 ───
    let stats = { iframes: 0, svgs: 0, imgs: 0, codeblocks: 0, toolmsgs: 0, thoughts: 0 };
    let isProcessing = false;
    const KEEP_LAST_N_MESSAGES = 4; // 최근 N개 메시지만 풀 DOM 유지
 
    // ─── 1. CSS 주입: 애니메이션 전체 비활성화 + GPU 메모리 절약 ───
    const injectCSS = () => {
        if (document.getElementById('ram-saver-css')) return;
        const style = document.createElement('style');
        style.id = 'ram-saver-css';
        style.textContent = `
            /* 숨길 요소 */
            div[data-testid="thought-block"],
            span.group\\/tool-message {
                display: none !important;
                height: 0 !important;
                overflow: hidden !important;
            }
 
            /* 모든 CSS 애니메이션/트랜지션 비활성화 → GPU 메모리 절약 */
            *, *::before, *::after {
                animation-duration: 0s !important;
                animation-delay: 0s !important;
                transition-duration: 0s !important;
                transition-delay: 0s !important;
            }
 
            /* 로딩 shimmer 비활성화 */
            .loading-results-shimmer {
                display: none !important;
                background: none !important;
            }
 
            /* 가상화된(비워진) 메시지 placeholder */
            [data-virtualized="true"] {
                min-height: 40px;
                max-height: 40px;
                overflow: hidden !important;
                opacity: 0.3;
            }
 
            /* 뱃지 */
            #ram-saver-badge {
                position: fixed !important;
                z-index: 2147483647 !important;
                bottom: 16px !important;
                right: 16px !important;
                padding: 6px 10px !important;
                background: rgba(0,0,0,0.8) !important;
                color: #00FF88 !important;
                border-radius: 8px !important;
                font: 11px/1.4 'SF Mono', Menlo, monospace !important;
                pointer-events: none !important;
                white-space: pre-line !important;
                box-shadow: 0 2px 12px rgba(0,0,0,0.4) !important;
                display: block !important;
                visibility: visible !important;
                opacity: 1 !important;
            }
        `;
        (document.head || document.documentElement).appendChild(style);
    };
 
    // ─── 2. UI 뱃지 ───
    const updateBadge = () => {
        let b = document.getElementById('ram-saver-badge');
        if (!b) {
            b = document.createElement('div');
            b.id = 'ram-saver-badge';
            document.documentElement.appendChild(b);
        }
        const total = Object.values(stats).reduce((a, c) => a + c, 0);
        b.textContent = `🧹 RAM Saver v5.0\niframe:${stats.iframes} svg:${stats.svgs} img:${stats.imgs}\ncode:${stats.codeblocks} tool:${stats.toolmsgs} think:${stats.thoughts}\n총 정리: ${total}개`;
    };
 
    // ─── 3. iframe 청소 ───
    const purgeIframes = () => {
        document.querySelectorAll('iframe:not([data-purged="true"])').forEach(frame => {
            const t = (frame.getAttribute('title') || '').toLowerCase();
            const s = (frame.getAttribute('src') || '').toLowerCase();
 
            // 시스템 필수 iframe 보호 (display:none인 숨겨진 인증용)
            if (frame.style.display === 'none' && !t && !s.includes('devspace')) return;
 
            const isTarget = t.includes('devspace') || t.includes('ui://') ||
                             t.includes('workspace') || s.includes('devspace') ||
                             s.includes('workspace-app') || s.includes('saved_resource');
 
            if (isTarget) {
                try { frame.contentWindow && frame.contentWindow.stop(); } catch(e) {}
                frame.removeAttribute('src');
                frame.removeAttribute('srcdoc');
                frame.src = 'about:blank';
                frame.setAttribute('data-purged', 'true');
 
                const wrapper = frame.closest('.no-scrollbar') ||
                                frame.closest('[class*="overflow-hidden"]') ||
                                frame.parentElement;
                if (wrapper && wrapper !== document.body) {
                    wrapper.innerHTML = '';
                    wrapper.style.cssText = 'display:none!important;height:0!important;';
                }
                stats.iframes++;
            }
        });
    };
 
    // ─── 4. 화면 밖 SVG 제거 ───
    const purgeSVGs = () => {
        // 대화 영역 안의 SVG만 대상 (사이드바/입력창 SVG는 보호)
        const chatArea = document.querySelector('[class*="react-scroll-to-bottom"]') ||
                         document.querySelector('main');
        if (!chatArea) return;
 
        chatArea.querySelectorAll('svg:not([data-purged="true"])').forEach(svg => {
            // 화면 밖에 있는 SVG만 제거
            const rect = svg.getBoundingClientRect();
            if (rect.bottom < -200 || rect.top > window.innerHeight + 200) {
                // 부모에 빈 placeholder 남기고 SVG 제거
                svg.setAttribute('data-purged', 'true');
                svg.innerHTML = '';
                svg.style.display = 'none';
                stats.svgs++;
            }
        });
    };
 
    // ─── 5. 화면 밖 이미지 언로드 ───
    const purgeImages = () => {
        const chatArea = document.querySelector('[class*="react-scroll-to-bottom"]') ||
                         document.querySelector('main');
        if (!chatArea) return;
 
        chatArea.querySelectorAll('img:not([data-purged="true"])').forEach(img => {
            const rect = img.getBoundingClientRect();
            if (rect.bottom < -300 || rect.top > window.innerHeight + 300) {
                if (img.src && !img.getAttribute('data-original-src')) {
                    img.setAttribute('data-original-src', img.src);
                }
                img.removeAttribute('src');
                img.removeAttribute('srcset');
                img.setAttribute('data-purged', 'true');
                img.style.cssText = 'height:20px!important;width:20px!important;';
                stats.imgs++;
            }
        });
    };
 
    // ─── 6. 코드블록 구문 강조 제거 (span 노드 대량 절약) ───
    const simplifyCodeBlocks = () => {
        const chatArea = document.querySelector('[class*="react-scroll-to-bottom"]') ||
                         document.querySelector('main');
        if (!chatArea) return;
 
        chatArea.querySelectorAll('pre:not([data-simplified="true"])').forEach(pre => {
            const rect = pre.getBoundingClientRect();
            // 화면 밖의 코드블록만 단순화
            if (rect.bottom < -200 || rect.top > window.innerHeight + 200) {
                const codeEl = pre.querySelector('code');
                if (codeEl) {
                    const plainText = codeEl.textContent; // span 다 벗기고 순수 텍스트만
                    codeEl.innerHTML = '';
                    codeEl.textContent = plainText;
                }
                pre.setAttribute('data-simplified', 'true');
                stats.codeblocks++;
            }
        });
    };
 
    // ─── 7. 생각 블록 & 툴 메시지 비우기 ───
    const purgeThoughtsAndTools = () => {
        document.querySelectorAll('div[data-testid="thought-block"]:not([data-purged="true"])').forEach(el => {
            el.innerHTML = '';
            el.setAttribute('data-purged', 'true');
            stats.thoughts++;
        });
        document.querySelectorAll('span.group\\/tool-message:not([data-purged="true"])').forEach(el => {
            el.innerHTML = '';
            el.setAttribute('data-purged', 'true');
            stats.toolmsgs++;
        });
    };
 
    // ─── 8. 오래된 메시지 가상화 (핵심!) ───
    const virtualizeOldMessages = () => {
        const messages = document.querySelectorAll('[data-message-id]:not([data-virtualized="true"])');
        if (messages.length <= KEEP_LAST_N_MESSAGES) return;
 
        // 최근 N개를 제외한 오래된 메시지의 내부를 비움
        const toVirtualize = Array.from(messages).slice(0, messages.length - KEEP_LAST_N_MESSAGES);
        toVirtualize.forEach(msg => {
            const rect = msg.getBoundingClientRect();
            // 화면 밖에 있을 때만 가상화
            if (rect.bottom < -100) {
                // 텍스트 요약만 남기고 내부 DOM 비우기
                const role = msg.getAttribute('data-message-author-role') || 'unknown';
                const preview = msg.textContent.substring(0, 80).trim();
                msg.innerHTML = `<div style="padding:8px;color:#888;font-size:11px;">[${role}] ${preview}...</div>`;
                msg.setAttribute('data-virtualized', 'true');
            }
        });
    };
 
    // ─── 메인 청소 함수 ───
    const fullPurge = () => {
        if (isProcessing) return;
        isProcessing = true;
        try {
            purgeIframes();
            purgeThoughtsAndTools();
            purgeSVGs();
            purgeImages();
            simplifyCodeBlocks();
            virtualizeOldMessages();
            updateBadge();
        } finally {
            isProcessing = false;
        }
    };
 
    // ─── MutationObserver (디바운스) ───
    let timer = null;
    const observer = new MutationObserver((muts) => {
        if (muts.every(m => m.target.id === 'ram-saver-badge' || m.target.id === 'ram-saver-css')) return;
        if (timer) clearTimeout(timer);
        timer = setTimeout(fullPurge, 400);
    });
 
    // ─── 부팅 ───
    injectCSS();
    observer.observe(document.documentElement, { childList: true, subtree: true });
 
    // 초기 실행 (페이지 로딩 직후 시차를 두고 3회)
    setTimeout(fullPurge, 500);
    setTimeout(fullPurge, 2000);
    setTimeout(fullPurge, 5000);
 
    // 백업: 5초마다 정기 청소 + 뱃지 복구
    setInterval(() => {
        fullPurge();
        updateBadge();
    }, 5000);
 
    console.log('🚀 [ChatGPT RAM Saver v5.0] Total Memory Purge 가동!');
})();

const KEEP_LAST_N_MESSAGES = 4;