[고성능 웹 개발]네트워크 전송 부분

7053 단어 웹 개발
[고성능 웹 개발]시리즈 가 될 거 예요.
html,js,css 등 전단 에서 HTTP/TCP 등 네트워크 전송 부분 까지.
Asp.net 등 응용 서버 언어 부터 데이터베이스 최적화 까지.
구조 설계 에서 제3자 구성 요소 와 해결 방안 의 응용 까지.
이후 약 4~5 편의 블 로그 가 고성능 웹 개발 과 관련 이 있다. 
[고성능 웹 개발]네트워크 전송 부분
1.요청 수 감소.
캐 시,Expires 사용 만 료 시간 설정 하기;내용 이 만 료 되 지 않 으 면 요청 을 보 내지 않 습 니 다.
4
  • 작은 부피 내용 을 합 친다.예 를 들 어 수량 이 많은 작은 그림 을 한 그림 에 놓 은 다음 에 css 부분 으로 나타 낸다(큰 부피 의 내용 은 합 쳐 지지 않 는 다)
  • 로드 지연;일부 내용,예 를 들 어 그림 이 페이지 에 나타 날 때 만 불 러 옵 니 다(스크롤 바 가 도착 한 후에 불 러 옵 니 다).불필요 한 요청 을 줄이다 

    • 중복 내용 과 파일 을 통합 합 니 다.
  • 제3자 CDN 자원 을 사용 하 는 것 을 고려 합 니 다.예 를 들 어 jQuery 는 무료 CDN 을 가지 고 있 습 니 다.일부 사용자 들 은 이미 다른 사이트 에서 이 내용 을 방문 한 적 이 있 습 니 다.그러면 저희 사이트 에 로드 하 는 것 이 빠 릅 니 다(그리고 CDN 을 사용 하여 저희 서버 에 대한 압력 을 낮 춥 니 다)
    • HTML 5 의 Local Storage 등 을 사용 하여 데 이 터 를 저장 합 니 다2.응답 내용 의 부 피 를 줄인다.
  • 적당 할 때 응답 헤드 304(ETag 등 HTTP 캐 시)만 되 돌려 줍 니 다
    • Gzip 등 압축 파일 내용 을 사용 합 니 다4
  • 무료 제3자 도 구 를 사용 하여 css,js 와 html 등 파일 의 크기 를 압축 합 니 다(예 를 들 어 우리 가 흔히 볼 수 있 는 jquery.min.js)
  • Ajax 조작 을 적 절 히 사용 합 니 다
    • 4.567917.적당 한 시기 에 스타일,HTML 과 데 이 터 를 분리(데이터 양 이 많 을 때 파일 의 부 피 를 크게 줄인다)
    <ul id="id">
        <li style="      ">   </li>
        <li style="      ">   </li>
        <li style="      ">   </li>
    </ul>
      HTML       3  

    HTML
    <ul id="id">
        <li></li>
        <!--                    Li        -->
    </ul>

         CSS   
                   li      li  class

      
      JSON   （               ）
  • 부피 가 더 작은 데이터 형식 을 선택한다.예 를 들 어 JSON 은 보통 XML 보다 부피 가 작다(모두 압축 을 거 친 후에 도 더 작다)
    • 4.567917.디자인 에 있어 변화 하 는 일부 데이터 만 전송 한다(예 를 들 어 100 개의 데 이 터 를 얻 으 려 면 90 개 를 불 러 왔 을 것 이다.그러면 10 개 를 더 불 러 오 면 된다)
  • 요청 과 응답 에서 불필요 한 HTTP Header 제거(예 를 들 어 WCF Restful service 에서 현재 데이터 가 JSON 인지 XML 인지 나타 내 는 HTTP Header)
  • 일부 기능,예 를 들 어 압축 은 CPU 를 소모 합 니 다.예 를 들 어 ajax 등 은 개발 작업량 을 증가 할 수 있 으 니 신중하게 선택 하 십시오
    • 3.요청 병발 수 증가.
  • RFC 에서 브 라 우 저 는 같은 도 메 인 이름 의 자원 에 대해 2 개의 스 레 드 를 사용 하여 동시에 접근 할 수 있 습 니 다(많은 새로운 브 라 우 저 는 6 개 이상 을 지원 합 니 다).해결 방법 은 하위 도 메 인 이름 을 사용 하 는 것 입 니 다.예 를 들 어 1.abc.com 2.abc.com
  • <img src ="1.abc.com/1.png" />
    <img src ="1.abc.com/2.png" />
    <img src ="2.abc.com/3.png" />
    <img src ="2.abc.com/4.png" />
    <img src ="3.abc.com/5.png" />
    <img src ="3.abc.com/6.png" />
    <img src ="4.abc.com/7.png" />
    <img src ="4.abc.com/8.png" />


    • 4
  • 아주 큰 파일(예 를 들 어 어떤 사람들 이 좋아 하 는 지 전체 사이트 의 js 를 하나의 파일 에 두 는 것)을 일련의 중 소 파일 로 뜯 습 니 다(동시 불 러 오기 와 캐 시 에 유리 합 니 다!)이 파일 크기 의 Size 선택 이 중요 합 니 다.저 는 개인 적 으로 10k-200 k(네트워크 에 의존)를 권장 합 니 다
    • 4.567917.이전 조항 은 1-2 와 충돌 하지 않 았 습 니 다.파일 이 너무 작 아 도 안 되 고 파일 이 너무 적어 도 안 됩 니 다.이것 은 균형 적 인 문제 입 니 다
  • 파일 을 분리 함으로써 가장 자주 사용 하 는 페이지(예 를 들 어 첫 페이지)의 로드 속도 가 빨 라 졌 다
  • 로 딩 순 서 를 제어 합 니 다.예 를 들 어 페이지 의 대체 구 조 를 먼저 불 러 온 다음 에 여러 개의 자바 script 비동기 로 데 이 터 를 불 러 오 라 고 요청 합 니 다(큰 html 를 여러 개의 작은 html 세 션 으로 바 꿉 니 다)
    • 4.기타 특수 기술.
    4.567917.HTTP 1.1 의 긴 연결 특성 을 이용 하여 어느 정도 에 서버 가 자발적으로 데 이 터 를 전송 할 수 있 게 한다(불필요 한 폴 링 을 많이 줄 였 다)5.도구.
  • Fiddler (Free)
  • FireDebug (Free)
  • HttpWatch

    • 일부 내용 은 MSDN 과 다른 제3자 문장 에서 인용 되 었 다.
    본인 의 수준 이 제한 되 어 있 으 므 로,만약 누락 되 거나 오류 가 있 으 면,여러분 의 고수 들 께 서 지적 하여 주시 기 바 랍 니 다.
    Python 파충 류 를 사용 하여 상하 이 증권거래소 와 선전 증권거래소 의 모든 주식 의 이름과 거래 정 보 를 얻 습 니 다.
    HDU 1180 기괴 한 계단 bfs

    좋은 웹페이지 즐겨찾기

    개발자 우수 사이트 수집

    개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
    best100-homepage