[Cloudflare] 클라우드플레어란? 클라우드플레어 작동원리

2 minute read

css도 바꿔보고, 웹폰트 최적화도 해보고, 캐싱한다고 이틀 내내 엔진엑스도 붙잡아보고, minify 자동화 한다고 파이썬 코드도 두들겨 보고.

약 3주간 성능 향상을 위해 부지런히 삽질한 내용이다.

그리고 막바지에 다다라서야 클라우드플레어라는 강력한 서비스를 발견하게 되었다..

1. 클라우드플레어는 어떻게 작동하는가


클라우드플레어는 DNS와 CDN 서비스를 제공하는 미국 기업이다. 도메인 네임 서비스를 제공하면서 트래픽 필터링도 해주고 Ddos도 차단해주고 분석도 해주고 CDN도 알아서 해주고.. 보안이나 성능, 사이트 안정화 등 여러 면에서 아주 우수한 서비스를 제공한다.

프론트 엔지니어라면 사이트 성능 개선과 최적화에 초점을 맞추어 클라우드플레어를 이용해야 한다.

그 전에 알고 가야할 것이 있다.

  1. 클라우드플레어에서는 기본적으로 캐싱을 해준다.

  2. (만약 프록시서버에서 캐싱 설정을 했으면)클라우드플레어에서 캐싱이 먼저 이루어진다.

이를 이해하려면 클라우드플레어의 동작 원리를 알아야 한다.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/a7bff5b4-48e0-4b5d-a729-463c1997f504/Untitled.png

                      일반적인 접근 <———————————————> 클라우드플레어 이용 

nginx와 uwsgi를 사용하고 있는 노스캠에 대입해보면 이렇다.

![https://s3-us-west-2.amazonaws.com/secure.notion-static.com/32b7d46b-5dc6-4772-8258-2c3dd09b3782/.jpg](https://s3-us-west-2.amazonaws.com/secure.notion-static.com/32b7d46b-5dc6-4772-8258-2c3dd09b3782/.jpg)

                                                  <클라우드플레어가 없는 경우>

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/729c3a01-755a-47dd-b233-e357197e0cc5/__02.jpg

                                                  <클라우드플레어가 있는 경우>

클라우드플레어에서 dns를 제공해주니까 유저가 url에 도메인 주소를 치면 클라우드플레어를 경유하여 ip로 된 실제 웹 서버에 도달한다.

2. 캐싱은 어디서 일어날까?


①일반적인 캐싱

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/2d639f7b-862c-4f03-8124-425d476c3303/__03.jpg

                                                  <클라우드플레어가 없는 경우>

클라우드플레어 없이 엔진엑스에서 캐싱을 한다면 위 그림처럼 프론트서버와 엔진엑스 사이에서 일어날 것이다.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/11c718b8-3468-42ef-a58b-8ca35673cb58/Untitled.png

네트워크탭에서 간단하게 확인해볼 수 있는데,

Response Headers에 “X-Proxy-Cache” 속성이 프록시 서버 캐싱 여부를 말해준다.

②클라우드플레어 캐싱

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/bf161f70-f576-4d95-864c-48fbeece082c/__04.jpg

                                                  <클라우드플레어가 없는 경우>

클라우드플레어를 사용한다면 오리진 서버로 도달하기 전에 캐싱이 일어난다.

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/cb0f2f38-5be5-470e-9124-a0488ec3b349/Untitled.png

역시 네트워크탭에서 보면 “cf-cache-status” 속성이 추가되었을 것이고 서버는 클라우드플레어로 바뀌어있을 것이다.

③만약 엔진엑스캐싱과 클라우드플레어 캐싱이 동시에 적용되어 있다면?

위의 그림처럼 애초에 엔진엑스까지 갈 일이 없으니 아무리 엔진엑스에서 캐시 설정을 해도 안될 것이다.

이때문에 종종 내가 설정한 Cache-Control이 덮어씌워질 때가 있는데

클라우드플레어에서 설정한 값으로 덮어씌워진 경우일 수 있다.

예를 들면 엔진엑스에서 max-age를 3달(7776000)로 설정했지만 클라우드플레어 설정에서 1달로 해놓았다면 max-age가 1달(2678400)로 바뀌어있을 것이다.

3. 클라우드플레어는 어떻게 캐싱할까?


이제 클라우드플레어가 어떻게 캐싱하는지 알아보자.

①동적, 정적 파일 모두 클라우드플레어를 거친다.

일반적으로는 거의 바뀌지 않는 정적 파일(js, css, img, favicon 등)만 캐시 서버를 거치도록 설정할 것이다.

그러나 클라우드플레어는 그런거 없고 동적 파일까지 모두 클라우드플레어를 경유하도록 되어있다.

그리고 동적 파일만 분류하여 클라우드플레어를 거치지 않게 하는 것은 불가능하다.

캐싱이 필요없는 파일까지 클라우드플레어를 거치면 서버가 느려지지 않을까?

  • 그렇지 않다. 클라우드플레어에 따르면 클플에서 전세계에 Edge를 두고 그 엣지들을 이어놓은 네트워크 회선을 사용하고 있기 때문에 거쳐야 할 hops 수가 줄어들어 오히려 빠르다고 한다. 그러나 이 부분은 주의해야할 것이 한국의 경우 엔터프라이즈 유저(유료 멤버)가 아니면 한국 Egde 사용이 불가하다고 한다. 더 느려질 수 있다는 뜻이다.

②특정 파일만 캐싱되게 할 수 있을까?

  • YES.

클라우드플레어 Page Rules 라는 메뉴에서 룰을 추가해줌으로써 일부 파일들은 캐싱이 되지 않게 또는 일부 파일들만 캐싱되게 설정할 수 있고 쿼리문으로도 제어가 가능하다.

③클라우드플레어 캐싱 설정은 어디서 하는가?

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/d6649191-cb36-4ca2-834f-b060008df32b/Untitled.png

클라우드플레어 설정에 보면 다양한 기능들이 있는데 이 중 “Caching”에서 할 수 있다.

유료 멤버 대상으로는 캐시 분석까지 해주지만

무료여도 캐시 삭제, 캐시할 양 설정, TTL 설정 등 유용한 기능을 제공한다.

전체적인 이해가 되었다면 이제 클라우드플레어로 캐시설정 및 사이트 최적화를 해보자.

다음 페이지에서 이어서 하겠다.

출처