사이트 아키텍처 및 성능

개요

이 문서에서 설명하는 기능과 관련하여 사용자가 직접 변경해야 할 설정은 없습니다. 이 글은 Kanorio 사이트가 방문자와 검색 엔진에 빠르고 완벽하게 전달되기 위해 시스템 내부에서 어떻게 작동하는지 이해를 돕기 위한 것입니다.

기존의 사이트 구축 방식(예: WordPress)은 서버 대여, 캐싱 설정, 이미지 압축 플러그인 설치 등이 필요하며, 플러그인을 너무 많이 설치하면 서로 속도를 저하시키는 문제가 발생하곤 했습니다. 또한, 일부 현대적인 사이트 빌더는 빈 껍데기만 전달하여 방문자의 모바일 기기가 텍스트를 표시하기 전에 무거운 스크립트를 실행하도록 강제하기도 합니다. Kanorio는 이러한 두 가지 문제를 근본적으로 해결합니다.

1. 검색 엔진과 방문자가 받는 것: 서버 사이드 렌더링

방문자가 링크를 클릭하거나 Google, Bing, ChatGPT, Perplexity와 같은 검색 엔진 및 AI 봇이 URL에 연결할 때, Kanorio 서버는 완전히 렌더링되고 포맷된 웹 페이지를 즉시 응답합니다:

• 제목과 콘텐츠가 첫 번째 응답에 포함됨: 페이지의 메인 제목(H1), 소제목(H2, H3), 모든 모듈 콘텐츠는 페이지가 도착하는 순간 이미 존재합니다. 브라우저가 페이지를 구성하기 위해 JavaScript를 실행할 때까지 기다릴 필요가 없습니다.
• 자동으로 정렬된 이동 경로(Breadcrumbs) 및 구조화된 데이터: 시각적 경로 탐색(예: 홈 › 쇼핑 › 상품명 또는 홈 › 블로그 › 카테고리 › 게시물)과 기계가 읽을 수 있는 Schema.org 구조화 데이터(비즈니스 정보, FAQ, 상품 가격, 게시물 및 이동 경로 마크업 포함)가 모두 초기 응답에 포함되어 전송됩니다.
• 사용자에게 어떤 이점이 있나요?
  1. 방문자에게 빈 화면을 보여주지 않음: 모바일 사용자는 링크를 클릭하자마자 레이아웃과 텍스트를 즉시 볼 수 있으며, 로딩 스피너를 쳐다볼 필요가 없습니다.
  2. 검색 엔진과 AI 봇이 즉시 이해함: 많은 크롤러는 브라우저 스크립트가 실행될 때까지 기다리지 않습니다. 서버 사이드 렌더링은 모든 검색 엔진과 AI 도구가 콘텐츠를 100% 읽을 수 있도록 보장합니다.

2. 사이트가 위치하는 곳: Cloudflare 글로벌 에지 네트워크 및 지능형 캐싱

공개된 웹사이트는 단일 원격 서버에서 호스팅되지 않으며, Cloudflare 글로벌 에지 네트워크 전반에 배포됩니다:

• 가장 가까운 노드에서의 직접 응답: 에지 노드는 전 세계에 위치하여 각 도시의 지점처럼 작동합니다. 방문자가 타이베이, 도쿄, 뉴욕 어디에 있든 캐시된 페이지는 가장 가까운 노드에서 전달되므로, 모든 요청마다 메인 서버까지 이동할 필요가 없습니다.
• 방문자 중단 없는 원활한 업데이트:
  • "게시"를 클릭하거나 SEO 설정을 업데이트하면 시스템은 즉시 에지 노드에 알리고 새 버전으로 교체합니다.
  • 백그라운드에서 페이지를 준비하는 몇 초 동안에도 시스템은 방문자가 지연 없이 페이지를 볼 수 있도록 보장합니다. 업데이트는 백그라운드에서 이루어지며 원활하게 전환되므로, 게시 버튼을 눌렀다고 해서 방문자가 멈춘 화면이나 오류 페이지를 마주하는 일은 없습니다.
• 블로그 게시물 및 상품에 대한 독립적인 업데이트: 새 블로그 게시물을 게시하거나 상품을 업데이트할 때, 시스템은 해당 항목과 관련 목록에 대한 캐시만 정확하게 업데이트하며 다른 페이지의 캐시 효율성에는 영향을 주지 않습니다.
• 사이트 소유자를 위한 최신 버전 즉시 액세스: 대시보드에서 "사이트 보기"를 클릭하면 시스템이 자동으로 미리보기 패스를 적용하여 캐시를 우회하고 최신 상태를 보여주므로 변경 사항을 즉시 확인할 수 있습니다.

3. 이미지 및 폰트 자동 최적화

고해상도 이미지와 웹 폰트는 일반적으로 모바일 사이트 속도를 저하시키는 두 가지 주요 원인입니다. Kanorio에는 이를 위한 완전 자동화된 가속 파이프라인이 있습니다:

이미지 자동 크기 조정 (여러 버전을 수동으로 자를 필요 없음)

• 데스크톱용 큰 이미지, 모바일용 작은 이미지: 선명한 원본 이미지를 하나만 업로드하면 됩니다. 시스템은 이를 웹 최적화 형식으로 자동 변환하고 최적의 품질로 조정하며 여러 크기 목록을 태그합니다. 방문자가 데스크톱의 큰 화면에서 탐색하면 큰 이미지를, 모바일에서는 화면 너비에 맞는 작은 이미지만 브라우저가 자동으로 다운로드합니다. 직접 여러 크기를 준비할 필요가 없습니다.
• 첫 화면(Above-the-fold) 이미지 우선 로딩: 시스템은 모든 페이지의 첫 번째 모듈 이미지를 다운로드 최우선 순위로 표시합니다. 페이지 하단에 있는 이미지는 로딩 첫 1초 동안 메인 이미지와 대역폭을 두고 경쟁하지 않습니다.
• 레이아웃 이동을 방지하기 위한 이미지 공간 예약: 모든 이미지는 로딩되기 전에 레이아웃상에서 가로세로 비율이 예약됩니다. 이는 텍스트가 나타난 후 로딩 중인 이미지가 갑자기 텍스트와 버튼을 아래로 밀어내어 방문자가 잘못된 곳을 클릭하게 만드는 일반적인 문제를 방지합니다.

자체 호스팅 폰트 및 온디맨드 로딩 (대역폭 절약 및 개인정보 보호)

• 플랫폼 에지 노드에서 자체 호스팅: 에디터에서 선택한 웹 폰트는 모두 Kanorio의 에지 네트워크에서 직접 제공됩니다. 방문자의 브라우저는 Google Fonts와 같은 외부 서버에 연결할 필요가 없습니다 (이는 도메인 간 연결 지연을 제거하고 방문자의 IP가 제3자와 공유되는 것을 방지합니다).
• 사용된 언어 및 문자 세트만 로딩: 시스템은 각 페이지의 실제 텍스트를 자동으로 분석하여 해당 페이지에 필요한 폰트 스타일과 문자 하위 집합만 로드하며, 전체 다국어 폰트 라이브러리를 방문자의 모바일 기기로 전송하지 않습니다.

4. 기능을 추가해도 사이트가 느려지지 않는 이유

• 내장 모듈, 플러그인 비대화 제로: 기존의 사이트 구축 방식은 폼, 슬라이더, 샵, SEO 기능을 조합하기 위해 수십 개의 타사 플러그인을 설치해야 하는 경우가 많았습니다. 플러그인이 많을수록 스크립트는 무거워지고 충돌 및 보안 취약점 위험은 높아집니다. Kanorio의 모든 모듈과 아이콘은 시스템 수준에서 중앙 집중식으로 효율적으로 관리됩니다. 페이지는 필요한 것만 로드하므로 페이지를 더 추가해도 홈페이지 속도가 느려지지 않습니다.
• 즉각적인 다크/라이트 모드: 사이트가 시스템의 다크/라이트 모드를 따르도록 설정된 경우, 페이지는 열리는 즉시 해당 배경색으로 렌더링되어 화면이 어두워지기 전의 "흰색 번쩍임" 현상을 방지합니다.
• 타사 추적 코드의 후순위 처리: Google Analytics(GA4), Google Tag Manager 또는 Meta Pixel이 설치된 경우, 시스템은 첫 화면 콘텐츠가 렌더링되거나 방문자가 스크롤을 시작할 때까지 기다린 후 백그라운드에서 추적 스크립트를 로드합니다. 광고 및 데이터 분석을 위해 사이트 속도를 희생할 필요가 없습니다.

5. Kanorio 사이트 호스팅 아키텍처 (기술 세부 정보)

기술 전문가, 기업 보안 평가자 또는 Headless API와의 통합을 계획 중인 개발자라면 Kanorio 공개 사이트의 실행 환경과 프론트엔드/백엔드 분리에 대한 다음 내용을 확인하십시오:

공개 사이트 글로벌 에지 실행 환경

Kanorio로 생성된 공개 사이트는 Cloudflare 글로벌 에지 네트워크를 통해 제공되며, HTTPS, CDN 캐싱, DDoS 보호 및 웹 애플리케이션 방화벽(WAF)의 이점을 누립니다. 브랜드별 콘텐츠는 렌더링 및 데이터 읽기 계층에서 엄격하게 격리되며, 실행 환경과 보안 업데이트는 플랫폼에 의해 중앙에서 유지 관리됩니다.

공개 렌더링, 핵심 백엔드 및 데이터베이스의 분리

공개 사이트 렌더링 서비스는 Kanorio의 핵심 백엔드 및 데이터베이스와 분리되어 있습니다:

• 공개 사이트 에지 렌더링 계층: 라우팅, 캐싱 및 공개 페이지 렌더링만 담당합니다. 메인 데이터베이스에 직접 연결되지 않으며 관리자 자격 증명을 보유하지 않습니다.
• 핵심 백엔드 및 데이터베이스: 회원, 고객 목록, 주문, 폼 제출 및 인증이 필요한 기타 정보는 사용자 ID 및 사이트 권한에 기반한 액세스 제어를 통해 Kanorio 핵심 백엔드(싱가포르 지역의 클라우드 서버 및 데이터베이스에서 호스팅)에서 처리됩니다(데이터 격리 및 인프라 제공업체의 책임에 대한 자세한 내용은 를 참조하십시오).

Headless API 고객을 위한 프론트엔드 배포 유연성

, 또는 을 사용하는 고객은 자체 프론트엔드 배포 플랫폼(예: Vercel, Netlify, Cloudflare Pages 또는 자체 서버)을 선택할 수 있습니다. Kanorio의 API를 통해 콘텐츠 및 커머스 기능을 사용하기 위해 사이트를 Cloudflare에 배포할 필요는 없습니다.

관련 문서