어떤 사이트의 로딩 속도를 측정하는 가장 객관적인 기준 중 하나는

크롬이나 파이어폭스 같은 최신 브라우저의 개발자도구(F12) 기능을 사용해서

Time to first byte (TTFB) 또는 Waiting 시간을 확인하는 것입니다. (둘 다 같은 의미입니다.)

서버에 요청을 전송한 후 서버에서 내용을 보내기 시작할 때까지 얼마나 시간이 걸리는지를 측정하는 거지요.

(전송을 마치기까지 얼마나 걸리는지는 인터넷 속도에 달려 있으므로 서버 성능의 문제가 아닙니다.)

 

물론 TTFB 시간이 전부는 아닙니다.

서버에서 내용을 받아오긴 했는데 무거운 자바스크립트가 엄청나게 들어 있거나,

대용량 이미지를 추가로 다운받아야 한다면 시간이 한참 더 걸리기 마련이죠.

그러나 이런 부분은 가벼운 레이아웃을 쓰거나 .htaccess에서 캐싱을 설정하는 방법으로 어느 정도 만회가 가능합니다.

반면, TTFB 시간은 서버가 웹페이지를 생성하기 위해 열심히 일을 하는 데 소요되는 시간이므로

쉽게 줄이기도 힘들고, 서버 부하와도 직결되는 문제입니다.

 

 

0.3초

 

보통 XE로 만든 사이트에서 TTFB 시간이 0.3~0.5초 (300~500ms) 정도 나오면 꽤 빠르다는 느낌을 받습니다.

일반적인 웹호스팅에 일반적인 XE 기반 사이트라면 대개 이 정도가 한계입니다.

 

 

0.2초

 

빠르기로 유명한 더쿠넷이나 XE타운은 0.2초 (200ms) 정도를 유지하고 있지요. XE 공홈도 비슷합니다.

가벼운 사이트라면 이 정도 나올 수 있습니다.

 

 

0.1초

 

아주 가벼운 사이트 + 고성능 서버 + 튜닝을 잘 하면 0.1초 (100ms) 이하로 낮출 수도 있습니다.

설치 직후에 내용이 하나도 없을 때는 0.05초 (50ms) 까지도 가능합니다.

 

여기서 더 낮출 수는 없을까요?

무겁기로 소문난 XE로는 불가능한 걸까요?

 

 

0.01초

 

아래의 스크린샷은 라이믹스로 만든 어느 커뮤니티 사이트의 로딩 속도를 파이어폭스 개발자도구로 살펴본 것입니다.

0.018초 (18ms) 의 TTFB 시간이 보이시나요?

 

supercache.png

 

(Connecting 시간이 0인 이유는 방금 새로고침했기 때문에 이미 서버에 연결되어 있어서 그렇습니다. HTTP/2 만세!)

 

라이믹스 자체의 기능은 아닙니다. 요즘 개발하고 있는 무시무시한 캐시 모듈 덕분입니다.

정식 배포할 경우 XE에서도 대부분의 기능을 활용할 수 있게 될 예정입니다.

 

캐시(cache)의 성격상 속도가 들쭉날쭉하므로 모든 상황에서 저런 속도가 나오지는 않겠지만,

로그인하지 않고 그냥 둘러보기만 하는 사용자의 비율이 높거나, 검색로봇의 방문이 잦은 사이트라면

일부 페이지를 빨리 처리하는 것만으로도 서버 부하를 크게 줄일 수 있게 됩니다.

다른 사용자들도 0.01초까지는 아니라도 평소보다 좀더 쾌적하게 사이트를 이용할 수 있게 될 테고요.

 

 

0.005초

 

제 개발서버에서 기록한 순간최고속도입니다.

이 정도 되면 서버에서 웹페이지를 생성하는 데 드는 시간보다

그 내용을 서울에서 지방으로 전송하는 데 드는 시간이 오히려 더 길어집니다.

저도 집에서 서울에 ping을 넣어 보면 0.01초 정도 걸리거든요.

 

지금 당장 XE로 만든 사이트도 튜닝만 잘 하면 서버 한 대로 동접 10,000명을 감당할 수 있습니다.

성능을 개선할 방법은 이렇게 점점 많아지고, 서버의 성능은 점점 좋아지고 있으니

동접 100,000명에 도전해 볼 날도 멀지 않았을 거예요 ^^

 

TAG •

기진곰

profile
GitHub @kijin 사람을 위한 인터넷 생태계의 발전에 많은 관심을 갖고 있습니다.
우리가 만들어 가는 XE의 새 이름, 라이믹스(Rhymix) 프로젝트에 참여하고 있습니다.
오픈소스 도로명주소 검색서버 및 API Postcodify를 개발, 운영중입니다.
국내외 서버 및 클라우드서버 세팅, 이전, 튜닝해 드립니다.
  • ?
    이 정도 되면 서버에서 웹페이지를 생성하는 데 드는 시간보다
    그 내용을 서울에서 지방으로 전송하는 데 드는 시간이 오히려 더 길어집니다.

    이 문장 무섭네요...
  • ?
    정말 기다리던 모듈입니다 ㅜ
  • profile
    생각 난 김에 관리 중인 사이트들 테스트해봤는데, 완전 실망이네요ㅠ
    개발하시는 모듈, 기다려집니다.
  • profile
    모듈 기대하고 있겠습니다. 빨리 완성이 되었으면 좋겠네요.
  • profile
    18ms !! 어디인지 모르지만 정말 빠르군요@_@ 우와!
  • profile profile

    마루타가 되고 있는 람보님 사이트 ㅋㅋㅋㅋ

  • ?
    호스팅에서는 사용불가능하겟지요?
  • ? profile

    가능할거에요! 맴캐시가 지원안되면 전체 캐싱은 불가능할지도 모르겠네요..

    맴캐시같은 오브잭트 캐싱 설정여부같은거요 ㅎ

     

  • profile
    무시무시한 모듈이 생기겠네요 ㅎㅎ
  • profile

    현재버전 XE 사이트에 설치해도 문제 없나요?

    일단 저희 사이트에도 적용해서 사용해 보고 있습니다.

  • profile profile
    로그인하지 않은 사용자를 위한 전체화면 캐시는 XE 현재 버전에서도 사용 가능합니다.
    일부 기능은 곧 나올 XE 1.8.25 이상에서만 지원됩니다.
  • profile profile
    일부기능이라는게 패치 안내되어있는 것을 패치하면 미리 사용해 볼수 있는거군요?
  • profile profile
    네. 요즘 XE에서 이런 종류의 패치를 잘 받아주는 편이긴 하지만, 만약 1.8.26까지도 코어에 받아들여지지 않는 패치가 있다면 모듈 자체에서 지원하는 방안을 연구중입니다.
  • profile
    18ms@@! 너무 빠르네요..

    페이지 전체를 캐싱하는 방법인가요?
  • profile profile

    네, 워드프레스의 유명한 캐시 플러그인들이 사용하는 것과 비슷한 기법입니다.
    moduleHandler.init에서 캐싱된 내용을 뿌려주고 종료해 버립니다.

  • profile profile
    아하! 기대됩니다..ㅎㅎ
  • ?

    제껀 0.1초 (80ms) 정도 나옵니다
    기진곰님이 알려주신 팁들이랑.. 구글링을 통해 검색해서 맞춰보니
    이정도가 저에게는 최대 한계선인듯 싶습니다 ㅜ
    모듈이 기다려집니다

  • ? ?
    기진곰님 팁들 어디인지 안내받을수 있을까요?
  • ? ?
    php버전이랑 opcache 관련단어를 xetown 위쪽 메뉴 검색창에서 검색해보세요~
    관련내용들을 한번 훝어보았습니다
  • profile
    수고 많으세요!
  • ?
    0.005초는 localhost에서인가요?
  • ? profile
    같은 네트워크상의 개발서버입니다 ㅎㅎ
  • profile ?
    아네. 외부 크롬에서 제사이트 TTFB가 171ms 가 나오던데 서버 사양에 따라 차이가 마니 나지는 않나요?
  • ? profile

    CPU 성능, DB 튜닝 상태, PHP 버전에 따라 10배 이상 차이날 수도 있습니다.
    서버 사양은 동접자를 얼마나 많이 처리할 수 있는지의 문제이지

    각각의 페이지를 생성하는 데 걸리는 시간과는 크게 관련이 없습니다.

  • profile ?
    기진곰님, DB튜닝에 관련된 내용중에 한글로 된 포스팅이나 웹문서가 있을까요?
    이게..단순히 옵션값만 바꾸는게 db튜닝을 뜻하는것인지 감이 안와서요
  • ? profile

    옵션값 바꾸는 거 맞습니다. 그러나 사이트의 성격과 규모, 서버 사양에 따라 옵션값이 달라져야 하기 때문에 무조건 어느 옵션을 1234로 바꾸라고 알려드리기는 곤란합니다. (무조건 바꾸면 빨라지는 옵션이 있다면 애초에 그 값으로 설정되어 나오겠죠? ㅎㅎ)

     

    검색 상위 10개 정도 대강 읽어보시면 공통된 내용이 꽤 많이 나오긴 합니다.

    https://www.google.co.kr/search?q=mysql+튜닝

  • profile ?
    전 memcached와opcahe 동시사용보다 opcache혼자 사용시 훨씬 속도개선이 됩니다. 댓글 내용중 페이지 전체를 캐시한다고 되어 있던데 제가 바라던 마치 캐시서버 같은 건지요? 비로그인 일경우 더 효율적인거 같은데 블로거들한테는더 없이 좋은 모듈이군요. 램 메모리에 바리 올려놓는다면 금상첨화? ㅎ.. 기대되네요.
  • ? profile

    opcache는 그야말로 기본 중의 기본이니까, memcached를 사용하면 느려진다고 해석하는 것이 옳겠네요. 실제로 벤치마킹을 해보면 느려지는 게 맞습니다. memcached는 개별 페이지의 로딩속도 향상보다는 동접수가 많을 때 전체적인 서버 부하를 줄이는 것이 목적이니까요. DB의 부하가 낮을 때는 memcached보다 DB가 오히려 빠릅니다.

    물론 비로그인 사용자가 많다면 페이지 전체가 캐싱되니까 memcached 때문에 느려지는 것을 만회하고도 남을 만큼 빨라지긴 하겠지요. 그래도 memcached를 피하고 싶으시다면 files/cache/store 폴더를 램디스크로 마운트하고 파일 캐시를 사용하세요 ㅎㅎ

  • profile
    대~ to the 박~!!!!
    기다리고 있습니다!!!!
    그 때 쯤 돼면... 라이믹스도 업데이트 해보려고요.. 무섭지만... ㄷㄷㄷㄷ
  • profile

    제작하시는 힘을내요슈퍼뽜월캐시를;; 내려 받아서 적용해 보았습니다. 정말 -_- 빠릅니다. 너무 빨라서 레이아웃이 다시 재정리 되는게 보일 정도.. 기본적으로 실시간 정리를 해야할 부분들은 예외 옵션에 넣지 않아도 되는건가요? 예외 act 설정항목이 있어서.. 한참 고민을 해봤습니다. (로그인? 회원가입? 포인트히스토리? 캐시모듈? ..)

  • profile profile

    설정화면에서 "기타 화면"을 선택하지 않으면 로그인, 회원가입 등 act가 들어가는 주소는 100% 예외처리되므로 별도로 예외를 지정할 필요가 없습니다. 나머지는 모듈 단위로 예외처리 + 새 글/댓글 작성시 자동 갱신 옵션을 사용하는 것이 편리합니다.

    전체화면 캐시를 워드프레스에서는 많이 쓰지만 XE에서는 워낙 생소한 개념이라, 문제가 생기지 않도록 이런 것들은 기본으로 선택되지 않게 해 두었습니다. 꼭 필요한 부분만 조금씩 예외를 추가하세요^^

  • profile
    페이지로딩 속도를 획기적으로 개선하는 모듈을 사용할 수 있게 되어 정말 놀랍고 굉장하다는 것을 세삼 느낍니다. 그런데 한가지 회원들에게는 캐시된 상황이 적절하지 못한 상황이 벌어져 비로그인에게만 제공되는 것은 어느정도 기술적으로 이해를 할 수 있을 것 같습니다.
    이렇다보니 로그인을 하지 않고 이용하고 싶은 충동이 들 정도로 쿼리없이 캐시된 페이지를 보여주는 속도에 욕심이 나는데요.

    이 모듈에서 제공하는 기능중 제한적으로 로그인 대상에게도 도움이 되는 기능들이 있나요? 설정에서 설정한대로 비로그인에게만 철저하게 모든 기능이 제공되는 것인지 궁금해지네요.
    저희 사이트의 경우 워낙 차이가 나다보니 비로그인과 로그인(슈퍼캐시 모듈 적용과 미적용)의 응답시간이 10배 이상 차이가 나네요.

    물론 비회원위주 혹은 비회원의 방문자체가 많은 부하를 일으킬수 있는 대규모 사이트의 경우 비회원의 부하만 줄여주어도 사이트 전체의 성능을 좀더 효율적으로 사용하여 속도나 수용능력을 업 시키는 모듈의 기본 취지는 이해하고 있습니다.
  • profile profile

    한국식 커뮤니티 사이트는 로그인 상태에서 캐싱 처리하기가 아주 어렵습니다 ㅠ

    만약 모든 레이아웃, 스킨, 위젯 등이 "이 부분은 member_srl에 따라 달라지는 내용이다"라고 표시해 줄 수 있고, 코어에서 그 부분만 따로 불러오는 기능을 제공한다면 로그인 사용자들에게도 캐시 처리를 해줄 수 있겠지요. 전체화면 캐시를 가져온 후 member_srl에 따라 달라지는 부분만 교체해 주면 되니까요. 실제로 이런 기능을 지원하는 웹서버 확장모듈도 있습니다. 구글 같은 데서 쓴다고 하더군요. 그러나 모든 서드파티 자료가 지원해 줘야 하므로 현재의 XE 기반으로 구현하기는 불가능에 가까울 겁니다.

    개발하면서 참고한 워드프레스의 각종 캐시 모듈들도 로그인 사용자는 그냥 포기하고 있습니다. 워드프레스는 대부분 블로그로 쓰기 때문에 로그인 사용자의 비율이 낮긴 하지만... 아무튼 그래서 전체화면 캐시는 로그인하지 않은 사용자들에게 혜택이 집중되고, 로그인 사용자들에게 주어지는 혜택은 전체적인 서버 부하를 낮춰서 좀더 쾌적해진다는 정도에 불과합니다.

    단, 게시판 캐시 기능은 게시판 하나에 몇만 개 이상의 글이 쌓여 있는 경우 모든 사용자에게 도움이 될 수 있습니다. 글 리젠율이 높은 사이트에서는 전체화면 캐시가 아닌 게시판 캐시 기능만으로도 성능 향상 효과가 어마어마합니다. 그러나 지금 웹지기님 사이트에서 이 기능으로 큰 차이가 날 만한 게시판은 보이지 않네요.

    아직 개발을 시작하지 않은 "위젯 캐시" 기능은 사이트에서 사용하는 모든 위젯에 장기간의 캐시를 일괄 적용하고, 새 글이 등록되면 해당 모듈을 참조하는 위젯만 업데이트해 주는 방식으로 계획하고 있습니다. 실시간 업데이트의 필요성 때문에 위젯 캐시를 충분히 활용하지 못하고 있는 사이트라면 아마 도움이 되겠지만, 이미 위젯 캐시를 쓰고 있다면 차이가 없을 듯 합니다.

    그 밖에도 많은 부하를 유발하는 일부 기능에 별도로 캐시를 적용할 수는 있겠지만, XE의 경우 대부분의 부하는 성능에 대한 심각한 고려 없이 만들어진 서드파티 자료 때문이므로... 해당 자료를 직접 패치하는 것이 다른 모듈에서 강제로 캐싱하는 것보다 바람직하다고 생각됩니다. (예: 알림센터, 출석부, checkdocument, 푸쉬앱 등)

     

    너무 자질구레한 기능을 많이 집어넣어서 슈퍼 캐시 모듈 자체가 무거워지는 것도 경계해야겠고요. 기본으로 로딩되는 class, controller, model 파일의 소스 분량만 해도 벌써 1400줄을 넘기고 있습니다. 위젯 캐시까지 추가하더라도 가능하면 2000줄을 넘기지 않도록 해보려고요.

  • profile profile
    자세한 답변 감사합니다. 네 저도 로그인 상태에서 화면뷰에서 처리되는 부분이 달라져야 하는 부분이 대부분이 회원제 사이트라 이부분은 모든 방문자에게 똑같은 뷰를 제공하는 캐시된 뷰를 제공하기는 어렵다고 생각했습니다.

    부가기능이 혹시 비로그인에게만 적용되는건 아닌가 하는 생각에서 질문을 드렸던 것인데 아닌 것이군요. 물론 사이트 환경에 따라 도움이 될지 아닐지의 문제는 다르겠지만 로그인 사용자에게도 개선을 시켜주는 부분들이 있다는 것에 환영할 만한 일이네요.

    솔직히 저희는 검색을 통해 방문하는 방문자들에게 빠른 응답을 보여주고 그들이 쿼리를 줄여줌으로써 회원들에게 보다 많은 자원을 사용할 수 있게 해주는 것에 만족하고 있습니다.

    앞으로 개발될 위젯캐시 기능을 활용한다면 조금 더 도움이 될 수도 있겠다는 생각이 드네요.
    그런데 위젯의 경우 순위변동을 반영해야 하는 경우 글작성에 의해 컨트롤이 되는 것이 아닌 추천이나 조회수의 변동에 따라 변경되어야 하는 상황이라 캐시기간을 길게 가져가기 어려울 것 같아 이부분은 적용이 어려울 것으로 예상이되어지네요. 새글을 뿌려주는 위젯의 경우 글 작성등의 액션에서 위젯을 다시 시작하는 것이 가능하겠지만요...

    이래저래 로그인상태와 추천이나 조회수 변동등에 변화가 일어나야 하는 부분들은 어려워지네요.

    하지만 현재의 기능만으로도 정말 획기적이고 놀라운 모듈입니다.
  • profile profile
    네, 추천이나 조회수에 따라 달라져야 하는 위젯은 슈퍼 캐시에서 예외처리하고 XE 자체의 위젯 캐시를 적당히 사용하시는 것이 좋겠습니다.
  • ?
    wincache 사용중입니다만
    더 느려질 수 도 있는건가요 ?
    이미지가 많은 서버라 그런건지.
    아니면 적용이 안되는건지 잘모르겟네요.
  • ? profile
    wincache는 확인해 보지 않았습니다. 캐시 분량이 상당히 많기 때문에 파일 캐시와 Memcached 외에는 권장하지 않습니다. 전체화면 캐시는 로그인하지 않은 상태에서만 성능 개선 효과가 있습니다.
  • profile ?

    파일 캐시는 괜찮은가요 ?
    Memcached 와 파일 캐시중 뭐가 효과가 좋을까요 ?

    비로그인에서 테스트했습니다. 조금이나마 나아진거 같더라구요.

  • ?
    몇몇분들 따라 하시는 것 같은데 방법이 어떻게 되나요? 전혀 모르겠습니다.

    https://xe1.xpressengine.com/forum/22745331

    이런게 있어서 비슷한가 싶은데 방법은 전혀 감이 오지 않습니다.
  • ? profile
    소스: https://github.com/kijin/xe-supercache
    설치경로: ./modules/supercache

    링크하신 예전 자료와는 전혀 무관하고, 사용법도 훨씬 쉽습니다.
  • profile ?
    헛 감사합니다. 조만간 적용해봐야겠습니다
  • profile ?
    감사합니다
  • profile
    이거 캐시..이거 저랑 상관이 있는거 같은데 ? ㅎㅎ 맞나요 ?
  • profile profile

    여러 사이트에서 필요로 하는 속도개선 관련 기능들을 하나의 범용 모듈로 모으고 있습니다. 비회원용 캐시 기능은 다른 사이트에 필요해서 만든 거고요, 약사이다님 사이트에 필요한 위젯캐시 기능도 곧 추가될 거예요.

  • profile profile
    실로 대단하십니당..
  • ?

    이 모듈은 그냥 신세계입니다.

     

  • ?
    진짜 기진곰님은 뒤에 곰 대신 신으로 바꾸셔야합니다. 멋져요
  • ?
    카미 모듈이네요... XE의 최대의 단점이자 유일한 단점을 분쇄! 해 버릴 수 도 있겠어요^^