웹 사이트 속도를 높이는 14 가지 조명 트릭

웹 사이트 속도에 관한이 블로그 시리즈는 재미있었습니다.

지금까지 웹 사이트 속도가 느려지면 아마존이 1.6 억 달러 (!)를 잃는다는 것을 알게되었습니다..

또한 웹 사이트 속도 저하를 유발할 수있는 비하인드 스토리를 배웠습니다..

자연스럽게 결론을 내릴 수 있습니다. 정확히 어떻게 속도를 높일 수 있습니까? 우리는 서버 속도에서 최적화 및 몇 가지 추가 보너스에 이르기까지 모든 것을 다루고 있습니다..

먼저 느린 속도를 일으키는 원인을 살펴 보겠습니다.

Bitcatcha에서 내 웹 사이트를 여기에로드하면 브라우저 (Firefox, Safari, Chrome 등)가 내 웹 서버와 대화를 시작합니다.

브라우저 :“이봐 웹 서버! Bitcatcha.com을 표시하기 위해 모든 비트와 조각을 얻을 수 있습니까?”

서버 :“물론, 찾아서 보내겠습니다”.

그런 다음 웹 서버는 모든 웹 사이트 부분을 터널에 넣고 브라우저로 전송하여로드합니다..

충분히 간단하게 들리지만 다음은 속도를 늦추는 것입니다.

• 요청에 응답하는 데 오래 걸리는 게으른 서버.
• 다른 많은 웹 사이트의 부품을 동시에 관리하는 서버.
• 각각 큰 터널을 찾아 터널로 보내야하는 많은 웹 사이트 ‘부분’.
• 바쁜 터널.

여기 잘못 될 수있는 것이 많이 있습니다. 우리는 어떻게 속도를 높이나요??

1 부 : 서버 속도 향상

1. 더 나은 웹 호스트 (예 : 더 나은 서버)로 업그레이드

웹 호스트는 서버를 제공하는 회사입니다. 인터넷 토지를 임대하는 것과 같습니다. 여기서 모든 웹 사이트 부품을 저장할 수 있습니다..

우리 대부분은 우리가 찾은 가장 저렴한 토지를 사는 경향이 있습니다. 그러나 이것이 반드시 현명한 해결책은 아닙니다.

저렴한 웹 호스트는 붐비고 작은 서버를 임대합니다. 서버가 요청에 신속하게 응답하고 터널을 통해 브라우저로 웹 사이트를 신속하게 보내려고합니다..

노트

서버 응답 시간을 기준으로 가장 빠른 웹 호스팅 목록을 확인하십시오..

2. 공유 호스팅에서 VPS로 전환

저렴한 웹 호스트는 다른 웹 사이트와 함께 서버에 웹 사이트를 배치합니다. 공유 호스팅이라고하며 리소스를 위해 싸워야한다는 의미입니다.

한 웹 사이트에서 갑자기 많은 트래픽이 발생하면 대역폭이 급격히 떨어지면서 속도가 느려집니다..

VPS (가상 사설 서버) 또는 적어도 SiteGround와 같은 고급 공유 서버로 전환하면 웹 호스트가 사용자를 위해 공유 서버의 모서리를 막을 수 있습니다. 리소스를 훔치는 다른 웹 사이트에 대해 걱정할 필요가 없습니다..

3. 서버를 청중에게 더 가까이 이동

누군가 사이트를 클릭 할 때마다 서버는 지구상의 정보를 컴퓨터 화면으로 물리적으로 보내야합니다..

서버가 세계 반대편에 있다면 시간이 오래 걸릴 것입니다. 대부분의 트래픽이 어디에서 오는지 알고 있다면 웹 호스트에게 웹 사이트를 주요 잠재 고객과 가장 가까운 서버에 배치하도록 요청하십시오.

4. 컨텐츠 전달 네트워크를 사용하십시오.

서버를 특정 사용자에게 더 가까이 이동시키는 데 어려움이 있다면 누군가 잃게 될 것입니다. 서버를 캘리포니아로 옮기면 호주 방문객들은 로딩 시간이 느려질 것입니다. 유럽 ​​방문객들도.

CDN (Content Delivery Network)은 전 세계 서버에 데이터를 저장합니다. 따라서 누군가가 웹 사이트를 클릭하면 가장 가까운 서버가 정보를 보냅니다..

그것은 당신의 방문자가 세계 어디에서나 초고속을 얻을 수 있음을 의미합니다. (참고로 Bitcatcha에서 Cloudflare를 사용합니다.)

5. ‘살아라’설정을 활성화하십시오.

서버가 웹 사이트 파일을 터널로 보내면 모든 부분이 별도로 이동합니다. CSS 스타일 시트, 로고, 각 이미지 등.

분명히이 작업을 수행하는 가장 효율적인 방법은 모두 동일한 큰 터널로 전송하는 것입니다..

여기에서‘살아 남기’설정이 시작됩니다. 활성화되면 기본 터널이 유지되고 모든 연결이 동일하게 연결됩니다 (매우 빠름)..

그러나 설정이 해제되면 모든 요소에 대해 새 터널을 만들어야합니다. (이거 너무 느려).

대부분의 웹 호스트는이 설정을 유지하지만 좋은 경우도 있지만 공유 호스트는 경고없이 연결을 닫습니다..

2 부 : 웹 사이트 요소 최적화

서버를 최대한 빠르고 효율적으로 만들었으므로 웹 사이트 자체를 최적화하는 방법?

6. 왕복 시간 (RTT) 단축

브라우저는 현재 한 번에 하나씩 각 요소를 서버에 요청해야합니다. 로고, 각 이미지, CSS 스타일 시트.

그것을받는 데 걸리는 시간은 한 번의 왕복입니다.

왕복 횟수가 많을수록 전체 웹 사이트를로드하는 데 시간이 더 걸립니다. 상자로 차를 포장하고 새 집으로 옮기는 것과 같습니다.

상자가 많을수록 왕복 여행 횟수가 많아집니다. 해결책? 복용하는 상자의 양을 줄입니다.

서버가 터널을 내려 보내야하는 요소의 양을 줄입니다. 더 적은 이미지, 더 적은 코드, 더 적은 플러그인.

7. 웹 사이트에서 압축을 활성화하십시오

불행히도, 그것은 단지 상자의 수가 아닙니다. 얼마나 무거워요? 모든 요소가 크고 무거 우면 터널에서 많은 공간을 차지하게됩니다. 또한 느리게 움직입니다. 트럭이 쌓이는 것과 같습니다. 무거운 상자로 가득 찬.

운 좋게도 웹 사이트 및 모든 웹 사이트를 압축 할 수 있습니다. Gzip과 같은 도구를 사용합니다. (브라우저의 90 %가 인식하고 있습니다. – 여전히 Internet Explorer 4를 사용하는 몇 명의 꼬마를 제외하고는 거의 모든 사람들입니다.)

사이트에서 가장 번거로운 부분은 이미지, HTML, CSS 및 Javascript입니다. 압축하면 사이트가 이동하는 동안 평균 ‘무게’를 줄일 수 있습니다.

재미있는 사실

웹 사이트의 평균 무게는 2MB이지만 매년 증가하고 있습니다..

8. 이미지 최적화

이미지는 일반적으로 모든 웹 사이트에서 가장 중요한 부분입니다. 가장 크고 뚱뚱하고 느린 로딩 요소입니다.

필요한 정확한 크기로 자르십시오. 큰 이미지를 업로드하지 말고 HTML로 축소하십시오. 올바른 크기로 업로드하기 만하면됩니다.

또한 업로드하기 전에 이미지를 압축하십시오. WordPress를 사용하는 경우 WP Smush와 같은 플러그인은 이미지 크기를 80 % 크게 줄일 수 있습니다.!

9.… 또는 스프라이트 만들기

스프라이트는 작은 이미지가 많이 포함 된 하나의 단일 이미지입니다. 버튼이나 다른 이미지 요소를 공유하기에 좋습니다.

이제 웹 사이트는 별도의 요청이 아닌 하나의 요청 만하면됩니다. 그런 다음 CSS를 사용하여 이미지의 어느 부분을 표시할지 선택할 수 있습니다.

10. 코드 다듬기

HTML은 밀도가 높고 무겁습니다. 또한 매우 반복적입니다. CSS는 좀 더 능률적이지만 많은 부분이 중복됩니다.

좋은 치아 빗으로 코드를 살펴보고 불필요한 모든 비트를 제거해야합니다..

WordPress, Tumblr 등의 템플릿을 사용하는 경우 사용하지 않는 코드가 많이있을 수 있습니다. 이 템플릿은 다양한 기능 옵션을 제공하도록 설정되었습니다. 그러나 우리 대부분은 그것을 모두 필요로하지는 않습니다.

무자비하다!

11. 쓸모없는 플러그인 제거 (WordPress)

우리는 수년 동안 수많은 플러그인을 실험했습니다. 그러나 종종 우리는 그것들을 제거하는 것을 잊어 버립니다..

모든 플러그인은 다른 서버 요청입니다. 고속 터널을 막는 또 다른 무거운 패키지입니다.

사용하지 않는 경우 끄십시오.

12. 리디렉션 감소

모든 리디렉션마다 패키지가 터널을 두 번 오르 내립니다. 꼭 필요한 경우가 아니면 웹 사이트에서 리디렉션을 사용하지 마십시오.

3 부 : 보너스 엑스트라

13. DNS 조회 감소

아직 이야기하지 않은 과정 중 하나가 있습니다. 그것은 바로 시작에서 발생.

브라우저가 서버와 대화를 시작하기 전에 서버의 위치를 ​​찾아야합니다 (IP 주소를 찾아서). 전화 번호부에서 서버 번호를 찾는 것과 같습니다. 시간이 좀 걸립니다 (보통 20-120 밀리 초).

웹 사이트와 연결된 도메인 이름이 여러 개인 경우 시간이 더 오래 걸립니다. 일반적인 예는 다음과 같습니다. blog.yourwebsite.com 또는 이미지, 스타일 시트 및 플래시 객체의 추가 도메인.

브라우저가 5 번 수행해야하는 경우 0.5 초를 잃을 수 있습니다. 가능한 적은 도메인으로 유지.

14. 브라우저 캐싱

브라우저가 모든 웹 사이트 파일의 사본을 보관할 수 있다면 얼마나 빠른지 상상해보십시오. 그렇게하면 매번 서버에 접속할 필요가 없습니다. 메모리에서로드 할 수 있습니다.

그것이 캐싱입니다. 브라우저가 웹 사이트를 ‘기억’한다는 의미입니다. 두 번째로로드하면 매우 빠릅니다.

휴! 평소보다 더 긴 글이지만 그만한 가치가 있다고 생각합니다.

이제 웹 사이트를 빠르게 만드는 데 필요한 모든 정보를 알고 있습니다. 이러한 트릭으로 인해로드 속도가 몇 초 단축 될 수 있습니다.

그것은 행복한 방문자를 의미합니다. 그리고 그것은 더 많은 판매를 의미합니다.

워드 프레스 속도 가이드

귀하의 웹 사이트가 WordPress로 구축 된 경우 WordPress 속도를 높이는 자세한 단계별 가이드를 작성했습니다. 정확한 단계를 사용하여 3 초 안에 Bitcatcha.com을로드합니다..