웹페이지를 개발하다보면 외부 콘텐츠를 삽입하기 위해서 iframe을 사용할 때가 종종 있다. 가령 유튜브를 블로그안에 넣는다고 해도 iframe을 이용해서 붙여넣도록 소스코드를 지원하고 있다. 웹 페이지에서 외부 콘텐츠를 삽입하는 방법인 iFrame 또는 인라인 프레임을 사용하면 로딩 시간과 전반적인 성능에 상당한 영향을 미칠 수 있다. 그렇다면 언제 사용하고 언제 사용하지 말아야 하는지 알아보자.
웹서버의 성능에 영향을 줌
당연한 이야기이겠지만 iframe은 웹페이지 로드 시간을 앞당기거나 늦출 수 있다. iframe은 총 페이지 로드 시간을 지연시킬 수 있는 차단 동작으로도 알려져 있다. iframe을 통해 콘텐츠를 로드하면 브라우저가 기본 페이지 콘텐츠와 병렬로 iframe 콘텐츠를 로드할 수 있으므로 잠재적으로 상위 페이지 로드 속도가 빨라질 수 있다. 특히 다른 도메인에서 기본 콘텐츠와 iframe 콘텐츠를 동시에 로드하면 로드 속도를 높일 수 있다. 즉, 동일한 서버에서 로드하는게 아니라 서로 다른 호스팅서버에서 동작할 경우 특히 빨라질 수 있다. 그러나 복잡하거나 부피가 큰 iframe 콘텐츠를 로드하는 데 필요한 추가 HTTP 요청으로 인해 프로세스가 느려질 수도 있다.
적절한 사용법
iframe은 비디오, 지도 또는 달력이나 지불 게이트웨이와 같은 위젯과 같은 타사 콘텐츠를 삽입하는 데 적합하다. 사이트 부분을 분리하고, 보안을 위해 동일 출처 정책을 적용하고, 사이트 섹션의 독립적인 로드를 허용할 수 있다. 사용도 간편하기 때문에 특히나 유튜브 영상을 붙일 때는 자주 사용하는 방법이기도 하다.
SEO 고려 사항
그러나 검색 엔진이 iframe과 상호 작용하는 방식으로 인해 올바르게 사용하지 않으면 SEO에 부정적인 영향을 미칠 수 있다. 사이트의 SEO 성능에 부정적인 영향을 미치지 않도록 올바르게 사용하는 것이 중요하다.
대안
iframe의 대안으로는 AJAX(Asynchronous JavaScript and XML)가 있다. 스크립트에서 응답을 기다리는 등의 소스의 복잡도는 올라가기는 하지만, iframe없이 특정 콘텐츠를 로드 할 수 있다. 하지만 앞서 말했듯이 응답이 왔을 경우 출력해야 할 html코드를 스크립트로 짜야 하는 복잡성과 고려사항이 있다.
결론
웹 개발의 많은 경우와 마찬가지로 iframe 사용 여부와 iframe이 성능에 미치는 영향은 특정 요구 사항, 로드하는 콘텐츠의 특성 및 사용자의 네트워크 상태에 따라 다르다. iframe은 여러 가지 이점을 제공하지만 잠재적인 성능 및 SEO 영향으로 인해 사용 시 신중한 고려가 필요하다. 항상 사용자 경험 및 사이트 성능에 미치는 영향에 대해 필요성을 평가해야할것이다.
