Develop 메뉴

Safari의 강력한 개발자 툴은 Develop 메뉴로 쉽게 사용할 수 있습니다. Develop 메뉴는 웹 페이지 조작 및 디버깅을 위해 사용할 수 있는 다양한 툴을 포함하고 있습니다.

Web Inspector

Web Inspector는 명령어 센터로, 웹 브라우저 내에 포함된 다양한 개발 툴을 쉽고 간편하게 사용할 수 있게 합니다. 여러분이 페이지의 구조를 보고 있거나, JavaScript를 디버깅하거나, 성능을 최적화하고자 할 경우, Web Inspector가 Safari의 개발자 툴을 가장 효율적인 웹 응용 프로그램을 개발할 수 있게 설계된 깨끗하고 통일된 인터페이스로 보여줄 것입니다.

JavaScript Debugger

Safari의 강력한 JavaScript Debugger는 여러분의 JavaScript 코드에 자주 틀리는 신택스, 세퍼레이터 실수 등의 문제가 있는지를 검사하여, 스크립트를 올바르게 구동할 수 있게 합니다. 더욱 정교한 디버깅을 위해서는 여러분의 스크립트에 분기점 (breakpoint)를 추가하여 코드의 특정 부분을 분리한 후 디버깅할 수 있습니다. 또한 스크립트가 실행 시 JavaScript 변수와 오브젝트를 검사할 수 있으므로 문제를 더욱 쉽게 찾아낼 수 있습니다.

JavaScript Profiler

Safari가 제공하는 예술적인 수준의 JavaScript Profiler를 이용하여 여러분의 JavaScript 코드를 최적화하십시오. Profiler는 여러분의 스크립트 기능의 성능 특성을 목록으로 만들어 문제가 되는 영역을 쉽게 찾아내고 웹 응용 프로그램이 최고의 성능을 발휘할 수 있게 해 줍니다.

Elements

Elements 패널에서는 여러분의 웹 페이지 구조를 더욱 자세히 볼 수 있습니다. Elements 패널은 여러분의 Document Object Model (DOM) 및 Cascading Style Sheets (CSS) 규칙을 쉽게 검사할 수 있게 해 줍니다.

Snippet Editor

Snippet Editor는 실험적인 HTML 마크업 부분을 쉽게 테스트할 수 있게 해 줍니다. 코드를 에디터에 입력하기만 하면, Safari가 즉시 렌더링한 결과를 보여 줍니다.

Resources

Resources 패널은 여러분이 제작한 모든 웹 페이지 리소스와 그래프를 네트워크 상에 로딩되는 순서와 속도로 깨끗하게 디스플레이 합니다. 이 데이터를 크기, 지연율, 응답 시간, 지속 시간 등과 같은 로딩 매개변수에 따라 정렬할 수도 있습니다. 작은 그래픽 요소를 로딩하는데 시간이 오래 걸린다면 네트워크 대역폭에 문제가 있을 수도 있습니다. 어쩌면 서버 반응 문제일지도 모릅니다. 다른 리소스를 로딩할 때까지 그래픽 요청이 이루어지지 않는다면, 여러분의 코드를 수정하여 리소스를 병렬 로딩시키는 것이 좋습니다. Resource 패널을 이용하여 로딩 시간 문제를 해결하고 여러분의 사이트 속도를 최적화해 보십시오.

Databases

Safari는 차세대 웹 응용 프로그램의 한 부분인 HTML5 오프라인 데이터를 위한 툴을 포함한 유일한 브라우저입니다. Safari의 Databases 패널을 통해 여러분의 localStorage 및 sessionStorage 데이터를 조회하고, SQL 데이터베이스 정보를 검사하고, 명령어 입력 인터페이스에서 SQL 쿼리를 실행시킬 수도 있습니다.