DevScope - 웹 진단 도구 제작자: POLPROG

DevScope은 현재 웹페이지를 필요할 때 검사하고 진단하는 전문 브라우저 개발 도구입니다.
분산된 도구를 오가지 않고 구조, CSS, 성능, 네트워크, 보안 헤더, 접근성, SEO, 저장소, JavaScript 런타임 및 감지된 프레임워크를 분석할 수 있습니다.

🧩 DOM 분석 및 요소 검사

• DOM 깊이, 복잡도, 중복 ID, 분리된 노드, 인라인 스타일 및 시맨틱 구조 분석
• 하이라이트 오버레이와 breadcrumb 탐색으로 페이지 요소 직접 선택
• 일반적인 구조적 anti-pattern에 대한 개선 힌트 확인

🎨 CSS 검사 및 실시간 편집

• 계산된 스타일, box model 및 실제 적용된 속성 확인
• Specificity 충돌과 잠재적인 레이아웃 문제 감지
• 스타일을 실시간 편집하고 변경을 즉시 확인하며 개별 속성 초기화

⚡ 성능 및 CORE WEB VITALS

• Core Web Vitals, paint timing, resource timing 및 long task 확인
• JavaScript 실행 신호와 유형별 리소스 사용량 분석
• 느린 파일과 잠재적인 성능 병목 지점 식별

🌐 네트워크, 저장소 및 런타임

• 네트워크 요청을 유형과 상태별로 분류하고 타이밍 분석
• LocalStorage, SessionStorage, 쿠키, IndexedDB 및 Cache API 검사
• 런타임 오류, 콘솔 메시지, 이벤트 리스너, 타이머 및 스크립트 활동 확인

🔐 보안 및 접근성

• HTTPS, mixed content, CSP, HSTS, Permissions-Policy 및 X-Frame-Options 검사
• ARIA, 대비, landmark, 라벨 및 누락된 대체 텍스트를 WCAG 기준으로 확인
• 명확한 결과와 권장사항으로 수정 우선순위 결정

🔎 SEO 및 프레임워크 감지

• 메타 태그, Open Graph, canonical URL, 구조화 데이터, 제목 계층 및 색인 가능성 검사
• React, Vue, Angular, Svelte, jQuery, Next.js, Nuxt.js, Tailwind CSS, Bootstrap 및 기타 라이브러리 감지
• 사용 가능한 버전 정보와 오래된 dependency 가능성 확인

🏥 사이트 상태 보고서

• P0, P1, P2로 분류된 우선순위 결과 생성
• 0에서 100까지의 DX Score를 빠른 기술 상태 지표로 사용
• 안정성, 네트워크, 성능 및 DOM 품질을 하나의 보고서에서 확인

📊 내보내기 및 비교

• 보고서를 JSON, CSV 또는 Markdown으로 내보내기
• 스냅샷을 만들고 결과를 비교하여 regression 감지
• 개별 모듈을 내보내 집중 분석

🛠 실제 디버깅을 위한 설계

패널을 오른쪽 또는 아래에 도킹하고 플로팅 모드, 크기 조절, Ctrl+Shift+D 전환을 사용할 수 있습니다.

Shadow DOM 격리는 검사 페이지에 대한 간섭을 줄입니다. 라이트와 다크 테마, 시스템 동기화 및 15개 언어 인터페이스를 지원합니다.

🔒 개인정보 보호 우선

개인정보를 수집하거나 탐색 활동을 추적하거나 분석 또는 텔레메트리를 사용하거나 외부 서버에 연결하지 않습니다.

페이지 분석은 기기에서 로컬로 실행됩니다. 설정은 브라우저에 저장됩니다.

🏢 제작자 소개

DevScope은 개인정보 보호 중심의 브라우저 확장 프로그램, 웹 애플리케이션 및 모바일 앱을 만드는 폴란드 기술 기업 POLPROG가 개발했습니다.

웹사이트: https://polprog.pl/
DevScope 제품 페이지: 제품 페이지 보기
브라우저 버전: Chrome Web Store에서 보기