다음을 통해 공유


연습: 출력 캐싱을 사용하여 웹 사이트 성능 향상

업데이트: 2007년 11월

성능은 웹 응용 프로그램에서 중요한 부분입니다. 웹 서버에서 개별 요청에 응답하기 위해 처리해야 하는 양을 감소시키면 응답 시간이 더 빨라지고 서버에서 동시 요청을 처리할 수 있게 되며 중간 및 백 엔드 데이터 시스템의 로드가 줄어듭니다.

ASP.NET에서 성능을 향상시키는 한 가지 방법은 출력 캐싱을 사용하여 서버 부하를 줄이는 것입니다. 출력 캐싱은 웹 서버 응답 시간을 줄여주는 최적화 방법입니다.

일반적으로, 브라우저에서 ASP.NET 페이지를 요청하면 ASP.NET에서는 페이지의 인스턴스를 만들고 페이지에서 코드를 실행하며 데이터베이스 쿼리를 실행하고(있는 경우) 페이지를 동적으로 어셈블한 다음, 결과 출력을 브라우저로 보냅니다. 출력 캐싱을 사용하면 ASP.NET에서 각 요청에 대해 이 처리 과정을 거치지 않고 전처리된 페이지 복사본을 보낼 수 있습니다. 이러한 차이는 웹 서버에서 수행하는 처리량을 줄여 주며 이로 인해 웹 서버의 성능이 향상되고 확장성이 향상됩니다.

이 연습에서 수행할 작업은 다음과 같습니다.

  • 브라우저 종류, 개별 매개 변수 또는 데이터에 관계없이 전체 페이지 출력이 캐시되도록 하는 페이지 지시문을 사용하여 페이지 캐싱

  • 전체 응용 프로그램의 출력 캐싱 설정을 정의할 수 있는 기능인 응용 프로그램 수준 캐시 프로필 사용. 개별 페이지는 Web.config 파일에 포함된 프로필에 연결될 수 있습니다. 이렇게 하면 각 페이지를 편집하는 대신 중앙에서 캐싱을 제어할 수 있습니다.

  • 페이지에 보내진 개별 매개 변수를 기준으로 캐싱

사전 요구 사항

이 연습을 따라 하려면 다음과 같은 요건이 필요합니다.

  • Visual Web Developer(Visual Studio)

  • .NET Framework 버전 2.0

웹 사이트 만들기

Visual Web Developer로 웹 사이트를 이미 만들었으면(연습: Visual Web Developer에서 기본 웹 페이지 만들기 참조) 이 연습의 다음 항목으로 이동합니다.그렇지 않으면, 다음 단계를 따라 새 웹 사이트와 페이지를 만듭니다.

파일 시스템 웹 사이트를 만들려면

  1. Visual Web Developer를 엽니다.

  2. 파일 메뉴에서 새 웹 사이트를 클릭합니다. Visual Web Developer Express Edition의 파일 메뉴에서 새로 만들기를 클릭한 다음 웹 사이트를 클릭합니다.

    새 웹 사이트 대화 상자가 나타납니다.

  3. Visual Studio에 설치되어 있는 템플릿에서 ASP.NET 웹 사이트를 선택합니다.

  4. 위치 상자에 웹 사이트의 페이지를 보관할 폴더의 이름을 입력합니다.

    예를 들어, 폴더 이름 C:\WebSites를 입력합니다.

  5. 언어 목록에서 작업할 프로그래밍 언어를 선택합니다.

  6. 확인을 클릭합니다.

  7. Visual Web Developer에서 해당 폴더와 Default.aspx라는 새 페이지를 만듭니다.

페이지 수준 캐싱 구성

이 절차에서는 기본 페이지 캐싱에 대해 소개하며 페이지를 처음 작성할 때 표시되는 페이지에 Label을 추가한 다음 해당 페이지가 캐싱되도록 구성합니다. 페이지의 작성 시간을 표시하여 페이지 요청이 캐시에서 수행된 것을 볼 수 있습니다.

페이지 수준 캐싱을 구성하려면

  1. Default.aspx 페이지로 전환하거나 이 페이지를 엽니다. 또는 웹 사이트에서 다른 페이지를 사용할 수 있습니다.

  2. 디자인 뷰로 전환합니다.

  3. 도구 상자의 표준 그룹에서 Label 컨트롤의 기본 이름을 Label1로 유지한 채 페이지로 끌어 옵니다.

  4. 페이지의 공백을 두 번 클릭합니다.

    디자이너에서 코드 편집기로 전환하고 Page_Load 메서드를 만듭니다.

  5. 메서드에 다음 강조 표시된 코드를 추가합니다.

    Protected Sub Page_Load(ByVal sender As Object, _
            ByVal e As System.EventArgs)
         Label1.Text = System.DateTime.Now.ToString()
    End Sub
    
    protected void Page_Load(Object sender, System.EventArgs e)
    {
         Label1.Text = System.DateTime.Now.ToString();
    }
    
  6. Ctrl+F5를 눌러 페이지를 실행합니다.

    페이지가 브라우저에 표시될 때 현재 날짜 및 시간이 표시됩니다. 브라우저의 새로 고침 단추를 눌러 타임스탬프가 매번 변경되는지 확인합니다.

  7. 브라우저를 닫습니다.

  8. 다음의 @ OutputCache 지시문을 페이지의 맨 위에 추가합니다.

    <%@ OutputCache Duration="15" VaryByParam="none" %>
    

    이 지시문은 페이지가 캐시되도록 구성합니다. Duration 특성은 페이지가 15초 동안 캐시에 보관되도록 지정합니다.

  9. Ctrl+F5를 눌러 페이지를 다시 실행합니다.

  10. 페이지를 여러 번 새로 고칩니다.

    시간 표시는 브라우저를 새로 고치는 횟수에 관계없이 15초마다 업데이트됩니다. 이는 페이지 코드가 다시 실행되는 지점에서 제한 시간이 경과될 때까지 요청이 캐시에서 수행되기 때문입니다.

응용 프로그램 수준 캐싱 설정

앞의 절차에서는 개별 페이지에 대한 캐싱을 구성했습니다. 경우에 따라 웹 사이트의 모든 페이지에 대해 캐싱을 구성할 수 있습니다. 서로 다른 캐싱 규칙(프로필)을 설정하여 개별 페이지 집합에 캐시 프로필을 적용할 수도 있습니다. 응용 프로그램 수준 캐싱을 설정하면 개별 페이지의 @ OutputCache 지시문을 편집하지 않고 단일 구성 파일에서 캐시 동작을 변경할 수 있습니다. 다음 절차에서는 간단한 캐시 프로필을 설정하여 작업 중이던 페이지에 사용합니다.

응용 프로그램 수준 캐싱을 구성하려면

  1. 이미 Web.config 파일이 있는 경우 4단계로 이동합니다.

  2. 솔루션 탐색기에서 웹 사이트의 이름을 마우스 오른쪽 단추로 클릭한 다음 새 항목 추가를 클릭합니다.

  3. 항목 추가 대화 상자에서 웹 구성 파일을 클릭한 다음 추가를 클릭합니다.

    Web.config라는 이름을 사용하는지 확인하십시오.

  4. 다음 XML을 system.web 요소의 자식으로 추가합니다.

    <!-- caching section group -->
    <caching>
    <outputCacheSettings>
        <outputCacheProfiles>
            <add name="AppCache1" enabled="true" duration="60"/>
        </outputCacheProfiles>
    </outputCacheSettings>
    </caching>
    
  5. 파일을 저장한 다음 닫습니다.

  6. 작업 중이던 웹 페이지로 전환하거나 연 다음 소스 뷰로 전환합니다.

  7. @ OutputCache 지시문을 다음과 같이 변경합니다.

    <%@ OutputCache CacheProfile="AppCache1" VaryByParam="none" %>
    
  8. Ctrl+F5를 눌러 페이지를 실행합니다.

  9. 페이지를 여러 번 새로 고칩니다.

    그러면 날짜가 캐시 프로필에 지정된 시간인 60초 동안 동일하게 유지됩니다.

매개 변수를 사용한 캐싱

@ OutputCache 지시문을 사용하려면 지금까지 "없음"으로 설정했던 VaryByParam 특성을 다시 설정해야 합니다. VaryByParam 특성을 사용하면 캐싱을 구성하여 ASP.NET에서 쿼리 문자열, 폼 게시 값 및 요청 헤더 등과 같은 매개 변수에 따라 다른 페이지 버전을 저장할 수 있습니다.

예를 들어, 선택 도시의 날씨 조건을 표시하는 페이지에서 캐시 매개 변수를 사용하여 3시간마다 날씨 데이터를 새로 고칠 수 있습니다. 이 시나리오의 경우, 각 도시에 대해 별도의 페이지 버전을 캐시할 수 있습니다. 이렇게 하려면 쿼리 문자열 매개 변수에 따라 캐시 매개 변수를 다양하게 설정합니다.

다음 절차에서는 페이지에 추가한 Label 컨트롤을 변경하여 시간에 배경색이 표시되도록 합니다. 색 이름을 입력하는 TextBox 컨트롤을 사용하여 색을 변경할 수 있습니다.

페이지를 전송하면 입력한 색이 게시 데이터로 전송되면서 Label 컨트롤 뒤의 색이 변경됩니다. 페이지에 새로운 게시 데이터가 전송되어 새로운 색이 요청되면, 페이지가 다시 생성되고 타임스탬프가 업데이트됩니다. 그러나 같은 색을 계속 요청할 경우에는 제한 간격이 초과될 때까지 캐시된 페이지를 반환합니다.

매개 변수를 기준으로 캐시하려면

  1. 작업 중이던 페이지로 전환하거나 엽니다.

  2. 디자인 뷰로 전환합니다.

  3. 도구 상자의 표준 그룹에서 TextBox 컨트롤을 페이지로 끌어 온 다음 해당 ID를 Color로 설정합니다.

  4. Button 컨트롤의 기본 이름을 Button1로 유지한 채 페이지로 끌어 옵니다.

  5. Button 컨트롤의 Text 속성을 "색 변경"으로 설정합니다.

    Button 컨트롤을 두 번 클릭하여 Click 이벤트 처리기를 만듭니다.

  6. 메서드에 다음 강조 표시된 코드를 추가합니다.

    Protected Sub Button1_Click(ByVal sender As Object, _ 
            ByVal e As System.EventArgs) Handles Button1.Click
        Label1.BackColor = _        System.Drawing.Color.FromName(Server.HtmlEncode(Color.Text))
    End Sub
    
    protected void Button1_Click(Object sender, System.EventArgs e)
    {
        Label1.BackColor =         System.Drawing.Color.FromName(Server.HtmlEncode(Color.Text));
    }
    
  7. form 요소의 defaultbutton 특성을 "Button1"로 설정합니다.

    이렇게 하면 Enter 키를 누를 때 단추의 Click 이벤트 처리기가 호출됩니다.

  8. @ OutputCache 지시문을 다음 버전으로 바꿉니다.

    <%@ OutputCache Location="Server" Duration="60" VaryByParam="Color" %>
    
  9. Ctrl+F5를 눌러 페이지를 실행합니다.

  10. 텍스트 상자에 "빨강" 또는 "파랑"과 같은 색 이름을 입력한 다음 색 변경을 클릭합니다.

    ASP.NET에서 지정한 색을 사용하는 페이지 버전을 캐시합니다.

  11. 페이지를 여러 번 새로 고칩니다.

    새로운 색 이름을 입력하지 않으면 날짜와 시간은 @ OutputCache 지시문의 Duration 특성에 지정된 대로 최소 1분 동안 변경되지 않습니다.

  12. "녹색" 또는 "연보라" 같은 새로운 색을 입력한 다음 페이지를 전송합니다.

    그러면 새로운 색으로 업데이트된 시간이 표시됩니다.

다음 단계

이 연습에서는 ASP.NET 페이지 캐싱에 대한 기본 개념에 대해 설명했습니다. 다음과 같은 추가 캐싱 기술을 확인할 수도 있습니다.

  • 페이지 선언을 사용하는 대신 캐싱을 프로그래밍 방식으로 지정할 수 있습니다. 예를 들어, Page_Load 메서드에서 Page.Response.Cache를 통해 HttpCachePolicy 클래스에 액세스하여 값과 동작을 적절하게 설정할 수 있습니다.

  • 데이터 바인딩된 페이지를 캐시하여 페이지에 종속된 데이터가 변경된 경우에만 다시 생성될 수 있도록 합니다. 자세한 내용은 연습: SQL Server에 ASP.NET 출력 캐싱 사용을 참조하십시오.

참고 항목

작업

연습: SQL Server에 ASP.NET 출력 캐싱 사용

개념

ASP.NET 캐싱 개요

참조

@ OutputCache

HttpCachePolicy

VaryByParams