1<!DOCTYPE html><html lang="kr-KR" ><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><meta name="pv-cache-enabled" content="false"><meta name="generator" content="Jekyll v4.2.0" /><meta property="og:title" content="ìºì ì ëµ" /><meta name="author" content="hayeon_kim" /><meta property="og:locale" content="kr_KR" /><meta name="description" content="ìµê·¼ ë¤ì¤ ìë² íê²½ìì ë¡ì»¬ ìºì를 ê¸ë¡ë² ìºìë¡ ë³ê²½í´ì¼ íë ìí©ì´ ììëë°, ìì
ì íë©´ì ìì ì ìì¤í
ëìì¸ ê°ì ë ë°°ì´ ìºì± ê°ë
ì ë¤ì ì§ì´ë³´ê² ëìë¤." /><meta property="og:description" content="ìµê·¼ ë¤ì¤ ìë² íê²½ìì ë¡ì»¬ ìºì를 ê¸ë¡ë² ìºìë¡ ë³ê²½í´ì¼ íë ìí©ì´ ììëë°, ìì
ì íë©´ì ìì ì ìì¤í
ëìì¸ ê°ì ë ë°°ì´ ìºì± ê°ë
ì ë¤ì ì§ì´ë³´ê² ëìë¤." /><link rel="canonical" href="https://hayeon17kim.github.io//posts/cache/" /><meta property="og:url" content="https://hayeon17kim.github.io//posts/cache/" /><meta property="og:site_name" content="íì°" /><meta property="og:type" content="article" /><meta property="article:published_time" content="2022-02-10T00:00:00+08:00" /><meta name="twitter:card" content="summary" /><meta property="twitter:title" content="ìºì ì ëµ" /><meta name="twitter:site" content="@MONI56219559" /><meta name="twitter:creator" content="@hayeon_kim" /><meta name="google-site-verification" content="google_meta_tag_verification" />
1<script type="application/ld+json"> {"author":{"@type":"Person","name":"hayeon_kim"},"headline":"ìºì ì ëµ","dateModified":"2022-02-10T21:37:04+08:00","datePublished":"2022-02-10T00:00:00+08:00","url":"https://hayeon17kim.github.io//posts/cache/","description":"ìµê·¼ ë¤ì¤ ìë² íê²½ìì ë¡ì»¬ ìºì를 ê¸ë¡ë² ìºìë¡ ë³ê²½í´ì¼ íë ìí©ì´ ììëë°, ìì
ì íë©´ì ìì ì ìì¤í
ëìì¸ ê°ì ë ë°°ì´ ìºì± ê°ë
ì ë¤ì ì§ì´ë³´ê² ëìë¤.","@type":"BlogPosting","mainEntityOfPage":{"@type":"WebPage","@id":"https://hayeon17kim.github.io//posts/cache/"},"@context":"https://schema.org"}</script>
1<title>ìºì ì ëµ | íì°</title><link rel="shortcut icon" href="/assets/img/favicons/favicon.ico" type="image/x-icon"><link rel="icon" href="/assets/img/favicons/favicon.ico" type="image/x-icon"><link rel="apple-touch-icon" href="/assets/img/favicons/apple-icon.png"><link rel="apple-touch-icon" href="/assets/img/favicons/apple-icon-precomposed.png"><link rel="apple-touch-icon" sizes="57x57" href="/assets/img/favicons/apple-icon-57x57.png"><link rel="apple-touch-icon" sizes="60x60" href="/assets/img/favicons/apple-icon-60x60.png"><link rel="apple-touch-icon" sizes="72x72" href="/assets/img/favicons/apple-icon-72x72.png"><link rel="apple-touch-icon" sizes="76x76" href="/assets/img/favicons/apple-icon-76x76.png"><link rel="apple-touch-icon" sizes="114x114" href="/assets/img/favicons/apple-icon-114x114.png"><link rel="apple-touch-icon" sizes="120x120" href="/assets/img/favicons/apple-icon-120x120.png"><link rel="apple-touch-icon" sizes="144x144" href="/assets/img/favicons/apple-icon-144x144.png"><link rel="apple-touch-icon" sizes="152x152" href="/assets/img/favicons/apple-icon-152x152.png"><link rel="apple-touch-icon" sizes="180x180" href="/assets/img/favicons/apple-icon-180x180.png"><link rel="icon" type="image/png" sizes="192x192" href="/assets/img/favicons/android-icon-192x192.png"><link rel="icon" type="image/png" sizes="32x32" href="/assets/img/favicons/favicon-32x32.png"><link rel="icon" type="image/png" sizes="96x96" href="/assets/img/favicons/favicon-96x96.png"><link rel="icon" type="image/png" sizes="16x16" href="/assets/img/favicons/favicon-16x16.png"><link rel="manifest" href="/assets/img/favicons/manifest.json"><meta name='msapplication-config' content='/assets/img/favicons/browserconfig.xml'><meta name="msapplication-TileColor" content="#ffffff"><meta name="msapplication-TileImage" content="/assets/img/favicons/ms-icon-144x144.png"><meta name="theme-color" content="#ffffff"><link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous"><link rel="dns-prefetch" href="https://fonts.gstatic.com"><link rel="preconnect" href="https://www.google-analytics.com" crossorigin="use-credentials"><link rel="dns-prefetch" href="https://www.google-analytics.com"><link rel="preconnect" href="https://www.googletagmanager.com" crossorigin="anonymous"><link rel="dns-prefetch" href="https://www.googletagmanager.com"><link rel="preconnect" href="cdn.jsdelivr.net"><link rel="dns-prefetch" href="cdn.jsdelivr.net"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" integrity="sha256-LA89z+k9fjgMKQ/kq4OO2Mrf8VltYml/VES+Rg0fh20=" crossorigin="anonymous"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fortawesome/[email protected]/css/all.min.css" integrity="sha256-+N4/V/SbAFiW1MPBCXnfnP9QSN3+Keu+NlB+0ev/YKQ=" crossorigin="anonymous"><link rel="stylesheet" href="/assets/css/style.css"><link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/afeld/[email protected]/dist/bootstrap-toc.min.css">
1<script src="https://cdn.jsdelivr.net/npm/jquery@3/dist/jquery.min.js"></script>
1
1<script defer src="https://cdn.jsdelivr.net/combine/npm/[email protected],npm/bootstrap@4/dist/js/bootstrap.min.js"></script>
1
1<script defer src="/assets/js/dist/post.min.js"></script>
1
1<script defer src="/app.js"></script>
vendor: 64 bytes, line 1
1 <script defer src="https://www.googletagmanager.com/gtag/js?id=
1UA-173202420-1
vendor: 12 bytes, line 1
1"></script>
1<script> document.addEventListener("DOMContentLoaded", function(event) {
vendor: 127 bytes, line 1
1window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', '
1UA-173202420-1
vendor: 4 bytes, line 1
1');
1}); </script>
1<body data-spy="scroll" data-target="#toc"><div id="sidebar" class="d-flex flex-column align-items-end"><div class="profile-wrapper text-center"><div id="avatar"> <a href="/" alt="avatar" class="mx-auto"> <img src="/assets/img/bio-photo.jpg" alt="avatar" onerror="this.style.display='none'"> </a></div><div class="site-title mt-3"> <a href="/">íì°</a></div><div class="site-subtitle font-italic">ì´ì ë³´ë¤ ëì ì½ë를 ìí´</div></div><ul class="w-100"><li class="nav-item"> <a href="/" class="nav-link"> <i class="fa-fw fas fa-home ml-xl-3 mr-xl-3 unloaded"></i> <span>HOME</span> </a><li class="nav-item"> <a href="/archives/" class="nav-link"> <i class="fa-fw fas fa-archive ml-xl-3 mr-xl-3 unloaded"></i> <span>ARCHIVES</span> </a><li class="nav-item"> <a href="/tags/" class="nav-link"> <i class="fa-fw fas fa-tags ml-xl-3 mr-xl-3 unloaded"></i> <span>TAGS</span> </a><li class="nav-item"> <a href="/categories/" class="nav-link"> <i class="fa-fw fas fa-stream ml-xl-3 mr-xl-3 unloaded"></i> <span>CATEGORIES</span> </a></ul><div class="sidebar-bottom mt-auto d-flex flex-wrap justify-content-center"> <a href="https://github.com/hayeon17kim" aria-label="github" class="order-3" target="_blank" rel="noopener"> <i class="fab fa-github-alt"></i> </a> <a href="https://twitter.com/MONI56219559" aria-label="twitter" class="order-4" target="_blank" rel="noopener"> <i class="fab fa-twitter"></i> </a> <a href=" javascript:location.href = 'mailto:' + ['hayeon17kim','gmail.com'].join('@')" aria-label="email" class="order-5" > <i class="fas fa-envelope"></i> </a> <a href="/feed.xml" aria-label="rss" class="order-6" > <i class="fas fa-rss"></i> </a> <span class="icon-border order-2"></span> <span id="mode-toggle-wrapper" class="order-1"> <i class="mode-toggle fas fa-adjust"></i>
1<script type="text/javascript"> class ModeToggle { static get MODE_KEY() { return "mode"; } static get DARK_MODE() { return "dark"; } static get LIGHT_MODE() { return "light"; } constructor() { if (this.hasMode) { if (this.isDarkMode) { if (!this.isSysDarkPrefer) { this.setDark(); } } else { if (this.isSysDarkPrefer) { this.setLight(); } } } var self = this; /* always follow the system prefers */ this.sysDarkPrefers.addListener(function() { if (self.hasMode) { if (self.isDarkMode) { if (!self.isSysDarkPrefer) { self.setDark(); } } else { if (self.isSysDarkPrefer) { self.setLight(); } } self.clearMode(); } self.updateMermaid(); }); } /* constructor() */ setDark() { $('html').attr(ModeToggle.MODE_KEY, ModeToggle.DARK_MODE); sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.DARK_MODE); } setLight() { $('html').attr(ModeToggle.MODE_KEY, ModeToggle.LIGHT_MODE); sessionStorage.setItem(ModeToggle.MODE_KEY, ModeToggle.LIGHT_MODE); } clearMode() { $('html').removeAttr(ModeToggle.MODE_KEY); sessionStorage.removeItem(ModeToggle.MODE_KEY); } get sysDarkPrefers() { return window.matchMedia("(prefers-color-scheme: dark)"); } get isSysDarkPrefer() { return this.sysDarkPrefers.matches; } get isDarkMode() { return this.mode == ModeToggle.DARK_MODE; } get isLightMode() { return this.mode == ModeToggle.LIGHT_MODE; } get hasMode() { return this.mode != null; } get mode() { return sessionStorage.getItem(ModeToggle.MODE_KEY); } /* get the current mode on screen */ get modeStatus() { if (this.isDarkMode || (!this.hasMode && this.isSysDarkPrefer) ) { return ModeToggle.DARK_MODE; } else { return ModeToggle.LIGHT_MODE; } } updateMermaid() { if (typeof mermaid !== "undefined") { let expectedTheme = (this.modeStatus === ModeToggle.DARK_MODE? "dark" : "default"); let config = { theme: expectedTheme }; /* re-render the SVG ⺠<https://github.com/mermaid-js/mermaid/issues/311#issuecomment-332557344> */ $(".mermaid").each(function() { let svgCode = $(this).prev().children().html(); $(this).removeAttr("data-processed"); $(this).html(svgCode); }); mermaid.initialize(config); mermaid.init(undefined, ".mermaid"); } } flipMode() { if (this.hasMode) { if (this.isSysDarkPrefer) { if (this.isLightMode) { this.clearMode(); } else { this.setLight(); } } else { if (this.isDarkMode) { this.clearMode(); } else { this.setDark(); } } } else { if (this.isSysDarkPrefer) { this.setLight(); } else { this.setDark(); } } this.updateMermaid(); } /* flipMode() */ } /* ModeToggle */ let toggle = new ModeToggle(); $(".mode-toggle").click(function() { toggle.flipMode(); }); </script>
1 </span></div></div><div id="topbar-wrapper" class="row justify-content-center topbar-down"><div id="topbar" class="col-11 d-flex h-100 align-items-center justify-content-between"> <span id="breadcrumb"> <span> <a href="/"> Posts </a> </span> <span>ìºì ì ëµ</span> </span> <i id="sidebar-trigger" class="fas fa-bars fa-fw"></i><div id="topbar-title"> Post</div><i id="search-trigger" class="fas fa-search fa-fw"></i> <span id="search-wrapper" class="align-items-center"> <i class="fas fa-search fa-fw"></i> <input class="form-control" id="search-input" type="search" aria-label="search" placeholder="Search..."> <i class="fa fa-times-circle fa-fw" id="search-cleaner"></i> </span> <span id="search-cancel" >Cancel</span></div></div><div id="main-wrapper"><div id="main"><div class="row"><div id="post-wrapper" class="col-12 col-lg-11 col-xl-8"><div class="post pl-1 pr-1 pl-sm-2 pr-sm-2 pl-md-4 pr-md-4"><h1 data-toc-skip>ìºì ì ëµ</h1><div class="post-meta text-muted d-flex flex-column"><div> <span class="timeago " data-toggle="tooltip" data-placement="bottom" title="Thu, Feb 10, 2022, 12:00 AM +0800" > Feb 10 <i class="unloaded">2022-02-10T00:00:00+08:00</i> </span> by <span class="author"> hayeon_kim </span></div><div> <span> Updated <span class="timeago lastmod" data-toggle="tooltip" data-placement="bottom" title="Thu, Feb 10, 2022, 10:37 PM +0900" > Feb 10 <i class="unloaded">2022-02-10T21:37:04+08:00</i> </span> </span> <span class="readtime" data-toggle="tooltip" data-placement="bottom" title="2385 words">13 min</span></div></div><div class="post-content"><p>ìµê·¼ ë¤ì¤ ìë² íê²½ìì ë¡ì»¬ ìºì를 ê¸ë¡ë² ìºìë¡ ë³ê²½í´ì¼ íë ìí©ì´ ììëë°, ìì
ì íë©´ì ìì ì ìì¤í
ëìì¸ ê°ì ë ë°°ì´ ìºì± ê°ë
ì ë¤ì ì§ì´ë³´ê² ëìë¤.</p><h1 id="cache">Cache</h1><h2 id="ìºì-ì¬ì©-ì´ì ">ìºì ì¬ì© ì´ì </h2><ul><li>Repeat: ë°ë³µì ì¸ í¸ì¶ì´ ìë ë°ì´í°<li>Immutability: ì ì ì¸(static) ë°ì´í° (html, css, images..)<li>Computation heavy: ë¹ì©ì´ ë§ì ìì
ì 결과물<ul><li>ex) ë§ì½ í¹ì ì§ì ìì í¹ì 목ì ì§ë¡ ê°ë ìµë¨ê±°ë¦¬ë¥¼ 구íë ìê³ ë¦¬ì¦ì ìê°ë³µì¡ëê° O(2^n)ì´ë¼ê³ í´ë³´ì. ì´ ê²°ê³¼ë¥¼ ìì²í ëë§ë
1¤ ê³ì°ì íë¤ë©´ ìë²ì ë¶ë´ì´ ì»¤ì§ ê²ì´ë¤. ìì²í ëë§ë¤ ê³ì°ì íë ê²ì´ ìëë¼ íë² ê³ì°ì íê³ ì´ ê²°ê³¼ë¥¼ ìºìíì¬ ê°ì ¸ì¬ ì ìëë¡ ë§ë¤ë©´ server failureê° ê°ìí ê²ì´ë¤.<li>ì¤ì 구ê¸ë§µ, ì¹´ì¹´ì¤ë§µììë ìºì를 íµí´ 목ì ì§ ê³ì° 결과를 리í´íê³ ìë¤.</ul></ul><h2 id="ì¡°í">ì¡°í</h2><p>facebook ìì ìºì를 ì¬ì©í´ post 를 ì¡°ííë¤ê³ í´ë³´ì.</p><p><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://user-images.githubusercontent.com/50407047/153418799-dd3bd64d-1407-4165-b3fe-4d8880736140.png" alt="image" /></p><p>ìºìì post ë°ì´í°ê° ìì ë post ì¡°í ìì²ì íë©´ ë¤ìê³¼ ê°ì íë¡ì¸ì¤ë¡ ì§íëë¤.</p><ol><li>í´ë¼ì´ì¸í¸ê° GET /post ìì²ì ìë²ì íë¤.<li>ìë²ë ìºìì í´ë¹ post ë°ì´í°ê° ìë ì§ íì¸íë¤.<li>ìë¤ë©´, DBì select ìì²ì í´ post ë°ì´í°ë¥¼ ê°ì ¸ì¨ë¤.<li>post를 ìºìì ì ì¥íë¤.<li>ìë²ë í´ë¼ì´ì¸í¸ì post ì 보를 ìëµíë¤.</ol><p>ìì ê°ì´ ìºìì ë°ì´í°ê° ìì ëë ì§ì° ìê°(latency)ê° ì¦ê°íë¤.</p><p><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://user-images.githubusercontent.com/50407047/153418832-e5673492-0aa7-4b99-bf82-8ae1f47c45e1.png" alt="image" /> ìºì íìë í´ë¼ì´ì¸í¸ì ë¹ ë¥´ê² ìëµí ì ìë¤. ìºìì post ë°ì´í°ê° ìì ë post ì¡°í ìì²ì íë©´ ë¤ìê³¼ ê°ì íë¡ì¸ì¤ë¡ ì§íëë¤.</p><ol><li>í´ë¼ì´ì¸í¸ê° GET /post ìì²ì ìë²ì íë¤.<li>ìë²ë ìºìì í´ë¹ post ë°ì´í°ê° ìë ì§ íì¸íë¤.<li>ìë¤ë©´, post를 ê°ì ¸ì¨ë¤.<li>ìë²ë í´ë¼ì´ì¸í¸ì ìºììì ì½ì´ì¨ post ì 보를 ìëµíë¤.</ol><p>ë°ë¼ì 첫ë²ì§¸ ìì²ë³´ë¤ë ë¹ ë¥´ê² ìëµí ì ìë¤.</p><h2 id="ìì ">ìì </h2><p>ì¡°íë ìì ê°ì íë¡ì¸ì¤ë¡ ì¼ì´ëëë°, ë§ì½ post를 editíë¤ë©´ ì´ë»ê² ë ê¹? ì´ë ê² ë°ì´í° ë³ê²½ ì ìºì ë©ëª¨ë¦¬ì ëë¹ì ë°ì´í° ì ì¥ ìì ì ê´í ì ì±
ì ìºì ì°ê¸° ì ì±
(Cache Write Policy)ë¼ê³ íë¤. ë ê°ì§ ë°©ë²ì ì¬ì©í ì ìëë°, <strong>Write Through</strong>ì <strong>Write Back</strong>ì´ ê·¸ê²ì´ë¤.</p><h3 id="write-through">Write through</h3><p><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://user-images.githubusercontent.com/50407047/153418878-7696e007-8865-4581-980f-2a8670b7b40d.png" alt="image" /></p><p>ìºìì DB ëë¤ì ì
ë°ì´í¸ë¥¼ í´ë²ë¦¬ë ë°©ìì´ë¤.</p><ul><li>ì¥ì : ìºìì ëë¹ì ì
ë°ì´í¸ë¥¼ í¨ê» í´, ë°ì´í°ì ì¼ê´ì±(consistency)ì ì ì§í ì ìì´ì ìì ì ì´ë¤.<li>ë¨ì : DBì ì
ë°ì´í¸ë¥¼ ì¹ë ë¹ì©ì´ ì기 ë문ì ì§ì° ìê°(latency)ì´ ì¦ê°íë¤.<li>ì ì í ìí©: ë°ì´í°ì ì¼ê´ì±ì´ ì¤ìí ë ì¬ì©íë¤.<li>íë¡ì¸ì¤<ol><li>í´ë¼ì´ì¸í¸ìì post ìì ìì²ì ë³´ë¸ë¤.<li>ìë²ë ì°ì ìºì를 ì
ë°ì´í¸íë¤.<li>ê·¸ë¦¬ê³ DB를 ì
ë°ì´í¸íë¤.<li>í´ë¼ì´ì¸í¸ì ìëµíë¤.</ol></ul><h3 id="write-back-cache">write back cache</h3><p><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://user-images.githubusercontent.com/50407047/153418909-939812eb-33f4-4743-ba70-5f2b7bbb7070.png" alt="image" /></p><p>ìë²ë ìºìì 먼ì ë°ì´í°ë¥¼ ì°ê³ í´ë¼ì´ì¸í¸ì ìëµíê³ , ì½ê°ì ì§ì° íì ë°ì´í°ë¥¼ ë¤ì ë°ì´í°ë² ì´ì¤ì ì´ë¤.</p><ul><li>ì¥ì : ë°ì´í°ë² ì´ì¤ì ëí ì°ê¸° ë¹ì©ì ì¤ì¼ ì ìë¤. (latencyê° ê°ìíë¤.)<li>ë¨ì <ul><li>ë°ì´í°ì ì¼ê´ì±(consistency)ì´ write through ì ë¹í´ ë¨ì´ì§ë¤.<ul><li>ëìì ì¬ë¬ í´ë¼ì´ì¸í¸ê° ìì²ì íë¤ë©´ ì
ë°ì´í¸ ì´ì ë°ì´í°ë¥¼ ê°ì ¸ì¬ ìë ìë¤. (ì´ë ë¤ì¤ ìë² íê²½ì¼ ì ë°ìí ì ìë 문ì ì´ë¤.)</ul></ul><li>ì ì í ìí©<ul><li>ë°ì´í°ì ì¼ê´ì±ì´ ì¤ìí ë ì¬ì©íë¤.<li>ì°ê¸°ê° ë§ì ë ì¬ì©íë¤.</ul><li>íë¡ì¸ì¤<ol><li>í´ë¼ì´ì¸í¸ìì post ìì ìì²ì ë³´ë¸ë¤.<li>ìë²ë ì°ì ìºì를 ì
ë°ì´í¸íë¤.<li>ìºì ë³ê²½ì 기ë¡íë¤.<li>í´ë¼ì´ì¸í¸ì ìëµíë¤.<li>ìë²ë asynchronousíê² ë³ê²½ 기ë¡ì ë³´ê³ ê·¸ì ë§ê²
1 nì´ë§ë¤ DB를 ì ë°ì´í¸íë¤.</ol></ul><h3 id="ì ì í-ìºì-ì°ê¸°-ì ì± ">ì ì í ìºì ì°ê¸° ì ì± ?</h3><p>ê·¸ë ë¤ë©´ <strong>write through</strong> ì <strong>write back</strong> ì¤ ì´ë¤ ìºì ì°ê¸° ì ì± ì ì¬ì©í´ì¼ í ê¹?</p><p>â <strong>ìë¹ì¤ì í¹ì±</strong>ì ë°ë¼ ë¤ë¥´ë¤!</p><ul><li>facebook feed: ì ë°ì´í¸ê° ë°ë¡ë°ë¡ íì¸ì´ ëì´ì¼ íë¤. â write through<li>blog: ì ë°ì´í¸ê° ë°ë¡ ë°ìëì§ ììë ëë¤. â write back</ul><h2 id="ìºì-ì¬ì©ì²">ìºì ì¬ì©ì²</h2><ul><li>íë¡ í¸: ì¸ì¦, html, css, javascript, images..<li>ë°±ìë: ê·¸ë¥ ë§ì´ ì°ì<li>íëì¨ì´: CPU cache L1/L2/L3</ul><aside> ð¡ CPU Cache L1/L2/L3? ìºì ë©ëª¨ë¦¬ë CPUê° ë©ëª¨ë¦¬ë¥¼ ì½ë ê³¼ì ìì ì주 ì´ì©íë ì 보를 ìºì ë©ëª¨ë¦¬ì ì ì¥í¨ì¼ë¡ì¨ ì¬ì¬ì© ì ëíë ì ë³´ì 거리를 ì¤ì¸ë¤. Lì Levelì ìê¸ì를 ë°ì¨ ê²ì¼ë¡ L1 ìºìë 1ì°¨ ìºì ë©ëª¨ë¦¬ì´ë¤. L1ë¶í° ìì°¨ì ì¼ë¡ ë°ì´í°ë¥¼ ì°¾ì L1ì ì°¾ê³ ì íë ë°ì´í°ê° ìì¼ë©´ ìì°¨ì ì¼ë¡ L2, L3ë¡ ì¬ë¼ê°ë©° ë°ì´í°ë¥¼ ì°¾ëë¤.</aside><h2 id="ë¤ì¤-ìë²-íê²½ììì-ìºì">ë¤ì¤ ìë² íê²½ììì ìºì</h2><p><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://user-images.githubusercontent.com/50407047/153418957-75102040-5925-4edf-aec2-3690ae5810a8.png" alt="image" /></p><ul><li>Youtube comment systemì ìê°í´ë³´ì. í´ë¼ì´ì¸í¸ê° âëê¸ ìì â ìì²ì ë³´ë´ê³ , ì´ ìì²ì´ ìë²1ì ë¿ëë¤ë©´, ìë²1ì í´ë¹ ìì²ì ìííì¬ ìºìì DB를 ì ë°ì´í¸í ê²ì´ë¤.<li>ê·¸ë¬ë ì´ë ì ë°ì´í¸í ìºìë ìë²1ì´ ì¬ì©íê³ ìë ìºìì´ê¸° ë문ì ë¤ë¥¸ ìë²ê° ì¬ì©íë ìºììë ì¬ì í ë³ê²½ì´ ëì§ ìì ìíì´ë¤.<li>ë°ë¼ì ë¤ë¥¸ ì ì ê° ìì²ì íì ë ë³ê²½ ì ì ë°ì´í°ë¥¼ ë³¼ ì ìë¤ë ê²ì´ë¤. ì¦, Data Consistencyê° ë¨ì´ì§ë¤.<li>ëí ìµì ì 보를 ê°ì ¸ì¤ê¸° ìí´ ìºìê° ìëë¼ DB를 ê³ì ì¡°íí´ì¼ íë¤ë©´ Server Failureê° ëìì§ ê²ì´ë¤.<li>ê·¸ë ë¤ë©´ ìºì를 ì¬ì©í ë ì´ë»ê² íë©´ DB ì¡°í를 ìµìííê³ , ë°ì´í°ì ì¼ê´ì±ì ì ì§í ì ììê¹?</ul><p><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://user-images.githubusercontent.com/50407047/153419012-d2be3641-d20c-432b-a262-472e95deced0.png" alt="image" /></p><ul><li>ì 그림과 ê°ì´ ì¬ë¬ ëì ìë²ê° íëì ìºì ì ì¥ì를 ê³µì íë©´ ëë¤. ê·¸ë¼ ë¤ë¥¸ ìë²ë¤ë ë³ê²½ì´ ë°ìë ìµì ì ë°ì´í°ë¥¼ ê°ì ¸ì¬ ì ìë¤.</ul><h2 id="cache-eviction">Cache Eviction</h2><ul><li>ìºì ê³µê°ì´ íìí ë ì´ë¤ ë°ì´í°ë¥¼ ì§ì°ë ê²ì Evictionì´ë¼ê³ íë¤.<li>LRUì LFU ìê³ ë¦¬ì¦ì´ ìë¤.</ul><aside> ð¡ ìºì ìë²ë ìë를 ìí´ì ëë¶ë¶ ë©ëª¨ë¦¬ë¥¼ ì¬ì©íë¤. ë©ëª¨ë¦¬ë¥¼ ì¬ì©íë©´ í¹í ì©ëì´ ë¶ì¡±í기 ë문ì ì´ ê³µê°ì ì´ë»ê² ì¬ì©í´ì¼ íëì§ì ëí´ ë¬¸ì ê° ë°ìíê² ëë¤. ë°ì´í° ê³µê°ì íë³´í기 ìí´ì Evictionì êµì¥í ì¤ìíë¤.</aside><h3 id="lru-least-recently-used">LRU (Least Recently Used)</h3><p>ìºìì í¬ê¸°ê° íê³ì ì´ë¥´ë©´, ì¬ì©ë ì§ ì¤ëë ìì¼ë¡ ì ê±°íë¤.</p><p><img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://user-images.githubusercontent.com/50407047/153419048-b66c5f2b-75d5-4869-8aff-bbe4f9a33e71.png" alt="image" /></p><p>ìºìì í¬ê¸°ê° 5ë¼ ê°ì í ë, LRU ìºì ë§ë£ ì ì± ì ì¬ì©íë ìºìë ë¤ìê³¼ ê°ì ììë¡ ì§íëë¤.</p><ul><li>M1, M2, M3, M4, M5 ìì¼ë¡ ë°ì´í°ë¥¼ ë£ëë¤.<li>M1ì´ ê°ì¥ ë¤ì ìê³ , M5ê° ìì ìë¤.<li>ìë¡ì´ M6 ê°ì²´ë¥¼ ì½ì íë ¤ê³ ìëí ë, ìºìì í¬ê¸°ê° íê³ì ì´ë¥´ë 기 ë문ì Evictionì ìííë¤.<li>ê°ì¥ ë¤ì ìë(ì¬ì©ë ì§ ê°ì¥ ì¤ëë) M1 ê°ì²´ë¥¼ ì ê±°íë¤.<li>M6ê°ì²´ë ìì¼ë¡ ë¤ì´ì¨ë¤. ë ë¤ë¥¸ M7 ê°ì²´ê° ë¤ì´ì¨ë¤ë©´ M2를 ì ê±°íê³ M6 ìì¼ë¡ ë¤ì´ì¬ ê²ì´ë¤.</ul><h3 id="lfu-least-frequently-used">LFU (Least Frequently Used)</h3><aside> ð¡ frequency: key-value 를 ì¼ë§ë retrieve íëì§ì ëí ì¹´ì´í¸</aside><p>ìºìì í¬ê¸°ê° íê³ì ì´ë¥´ë©´, ì¬ì©ë ë¹ëê° ë®ì ìì¼ë¡ ì ê±°ëë¤.</p><p>LFUë ë´ë¶ì ì¼ë¡ ì¬ì© ë¹ëì를 측ì íë Frequency Tableì ê°ê³ ìë¤.</p><p>ë¤ìê³¼ ê°ì´ Frequency Tableì´ ìê³ , íì¬ ìºìê° ê½ ì°¨ ìë¤ê³ ê°ì íì.</p><div class="language-jsx highlighter-rouge"><div class="highlight"><code><table class="rouge-table"><tbody><tr><td class="rouge-gutter gl"><pre class="lineno">1 22 33 44 55 66 7</pre><td class="rouge-code"><pre><span class="nx">FrequencyTable</span> <span class="o">=</span> <span class="p">{</span> 8 <span class="mi">1</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M1</span><span class="p">,</span> <span class="nx">M2</span> <span class="p">],</span> 9 <span class="mi">2</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M3</span><span class="p">,</span> <span class="nx">M4</span> <span class="p">],</span> 10 <span class="mi">3</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M5</span> <span class="p">],</span> 11 <span class="mi">4</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M6</span> <span class="p">]</span> 12<span class="p">};</span> 13</pre></table></code></div></div><p>M2를 ì¬ì©íë¤ë©´ ë¤ìê³¼ ê°ì´ FrequencyTableì´ ë³íë¤.</p><div class="language-jsx highlighter-rouge"><div class="highlight"><code><table class="rouge-table"><tbody><tr><td class="rouge-gutter gl"><pre class="lineno">1 142 153 164 175 186 19</pre><td class="rouge-code"><pre><span class="nx">FrequencyTable</span> <span class="o">=</span> <span class="p">{</span> 20 <span class="mi">1</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M1</span> <span class="p">],</span> 21 <span class="mi">2</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M3</span><span class="p">,</span> <span class="nx">M4</span><span class="p">,</span> <span class="nx">M2</span> <span class="p">],</span> 22 <span class="mi">3</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M5</span> <span class="p">],</span> 23 <span class="mi">4</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M6</span> <span class="p">]</span> 24<span class="p">};</span> 25</pre></table></code></div></div><p>ìë¡ì´ M7 ê°ì²´ê° ë¤ì´ì¨ë¤ê³ í ë, ì´ë¯¸ ìºìë ê½ ì°¨ ì기 ë문ì Evictionì ì§íí´ì¼ íë¤. íì¬ í¤ê° 1ì¸ M1ì´ ê°ì¥ ì¬ì© ë¹ëìê° ë®ì¼ë¯ë¡, M1ì´ ì ê±°ëë¤.</p><div class="language-jsx highlighter-rouge"><div class="highlight"><code><table class="rouge-table"><tbody><tr><td class="rouge-gutter gl"><pre class="lineno">1 262 273 284 295 30</pre><td class="rouge-code"><pre><span class="nx">FrequencyTable</span> <span class="o">=</span> <span class="p">{</span> 31 <span class="mi">2</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M3</span><span class="p">,</span> <span class="nx">M4</span><span class="p">,</span> <span class="nx">M2</span> <span class="p">],</span> 32 <span class="mi">3</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M5</span> <span class="p">],</span> 33 <span class="mi">4</span><span class="p">:</span> <span class="p">[</span> <span class="nx">M6</span> <span class="p">]</span> 34<span class="p">};</span> 35</pre></table></code></div></div><p>ë¤ìì ë ë¤ë¥¸ ê°ì²´ê° ë¤ì´ì¨ë¤ë©´, íì¬ ê°ì¥ ë®ì ë¹ëìì¸ (keyê° 2ì¸ ë°°ì´ì ìì ì¤ íë) ê°ì²´ê° ì ê±°ë ê²ì´ë¤.</p></div><div class="post-tail-wrapper text-muted"><div class="post-meta mb-3"> <i class="far fa-folder-open fa-fw mr-1"></i> <a href='/categories/system-design/'>system-design</a></div><div class="post-tags"> <i class="fa fa-tags fa-fw mr-1"></i> <a href="/tags/system-design/" class="post-tag no-text-decoration" >system-design</a></div><div class="post-tail-bottom d-flex justify-content-between align-items-center mt-3 pt-5 pb-2"><div class="license-wrapper"> This post is licensed under <a href="https://creativecommons.org/licenses/by/4.0/">CC BY 4.0</a> by the author.</div><div class="share-wrapper"> <span class="share-label text-muted mr-1">Share</span> <span class="share-icons"> <a href="https://twitter.com/intent/tweet?text=ìºì ì ëµ - í
35ì°&url=https://hayeon17kim.github.io//posts/cache/" data-toggle="tooltip" data-placement="top" title="Twitter" target="_blank" rel="noopener" aria-label="Twitter"> <i class="fa-fw fab fa-twitter"></i> </a> <a href="https://www.facebook.com/sharer/sharer.php?title=ìºì ì ëµ - íì°&u=https://hayeon17kim.github.io//posts/cache/" data-toggle="tooltip" data-placement="top" title="Facebook" target="_blank" rel="noopener" aria-label="Facebook"> <i class="fa-fw fab fa-facebook-square"></i> </a> <a href="https://telegram.me/share?text=ìºì ì ëµ - íì°&url=https://hayeon17kim.github.io//posts/cache/" data-toggle="tooltip" data-placement="top" title="Telegram" target="_blank" rel="noopener" aria-label="Telegram"> <i class="fa-fw fab fa-telegram"></i> </a> <i class="fa-fw fas fa-link small" onclick="copyLink()" data-toggle="tooltip" data-placement="top" title="Copy link"></i> </span></div></div></div></div></div><div id="panel-wrapper" class="col-xl-3 pl-2 text-muted topbar-down"><div class="access"><div id="access-lastmod" class="post"> <span>Recent Update</span><ul class="post-content pl-0 pb-1 ml-1 mt-2"><li><a href="/posts/cache/">ìºì ì ëµ</a><li><a href="/posts/today-i-learned-2021-04-26/">ð¥ 주ëì´ ì±ì¥ì¼ê¸°: 2021.04.26</a><li><a href="/posts/today-i-learned-2021-04-28/">ð¥ 주ëì´ ì±ì¥ì¼ê¸°: 2021.04.28</a><li><a href="/posts/today-i-learned-2021-04-25/">ð¥ 주ëì´ ì±ì¥ì¼ê¸°: 2021.04.25</a><li><a href="/posts/today-i-learned-2021-04-27/">ð¥ 주ëì´ ì±ì¥ì¼ê¸°: 2021.04.27</a></ul></div><div id="access-tags"> <span>Trending Tags</span><div class="d-flex flex-wrap mt-3 mb-1 mr-3"> <a class="post-tag" href="/tags/java/">java</a> <a class="post-tag" href="/tags/javascript/">JavaScript</a> <a class="post-tag" href="/tags/bitcamp/">bitcamp</a> <a class="post-tag" href="/tags/modernjs/">modernJS</a> <a class="post-tag" href="/tags/project/">project</a> <a class="post-tag" href="/tags/algorithm/">algorithm</a> <a class="post-tag" href="/tags/trouble-shooting/">trouble-shooting</a> <a class="post-tag" href="/tags/devil/">devil</a> <a class="post-tag" href="/tags/corejs/">corejs</a> <a class="post-tag" href="/tags/network/">network</a></div></div></div>
35<script src="https://cdn.jsdelivr.net/gh/afeld/[email protected]/dist/bootstrap-toc.min.js"></script>
35<div id="toc-wrapper" class="pl-0 pr-4 mb-5"> <span class="pl-3 pt-2 mb-2">Contents</span><nav id="toc" data-toggle="toc"></nav></div></div></div><div class="row"><div class="col-12 col-lg-11 col-xl-8"><div id="post-extend-wrapper" class="pl-1 pr-1 pl-sm-2 pr-sm-2 pl-md-4 pr-md-4"><div id="related-posts" class="mt-5 mb-2 mb-sm-4"><h3 class="pt-2 mt-1 mb-4 ml-1" data-toc-skip>Further Reading</h3><div class="card-deck mb-4"><div class="card"> <a href="/posts/system-deisign-01/"><div class="card-body"> <span class="timeago small" > Jul 10, 2021 <i class="unloaded">2021-07-10T00:00:00+08:00</i> </span><h3 class="pt-0 mt-1 mb-3" data-toc-skip>ìì¤í
ëìì¸ ê°ë
ì 리: Latency, Throughput, CDN, Availability</h3><div class="text-muted small"><p> Latency & Throughput ìì¤í
ëìì¸ìì ì ë§ ì¤ìí ê°ë
ì´ë¤. Latency(ì§ì°ìê°) ë¤í¸ìí¬ìì íëì ë°ì´í° í¨í·ì´ í ì§ì ìì ë¤ë¥¸ ì§ì ì¼ë¡ ë³´ë´ì§ë ë° ììëë ìê°ì ë§íë¤. ë³´íµ ìì²ì´ ìì ë ìì²ì ì²ë¦¬íê³ ìëµí ëê¹ì§ì ìê°ì ë§íë¤. ì¼ë°ì ì¼ë¡ Latencyë ë ë¤í¸ìí¬ì ê±°ë¦¬ê° ë© ë ...</p></div></div></a></div><div class="card"> <a href="/posts/docker/"><div class="card-body"> <span class="timeago small" > Jun 23, 2021 <i class="unloaded">2021-06-23T00:00:00+08:00</i> </span><h3 class="pt-0 mt-1 mb-3" data-toc-skip>Dockerë 무ìì¸ê°</h3><div class="text-muted small"><p> ë°°ê²½ Environment Disparity 문ì 를 í´ê²°í´ì¤ë¤. ë¤ë¥¸ 머ì ììë ê°ì íê²½ì 구íí ì ìë¤. ex) ìì
íë 머ì ì ìëì°ê³ , ìë² ë¨¸ì ì 리ë
ì¤ë¼ê³ í ë, ì½ë를 ê³ ì¹ê³ ë°°í¬í ë environment disparityë문ì ëìì íì§ ìì ì ìë¤. ì´ë ë커를 ìëì°ì 리ë
ì¤ì ì¤ì¹ë¥¼ íê³ , Dockerfileì...</p></div></div></a></div><div class="card"> <a href="/posts/today-i-learned-2021-05-06/"><div class="card-body"> <span class="timeago small" > May 6, 2021 <i class="unloaded">2021-05-06T00:00:00+08:00</i> </span><h3 class="pt-0 mt-1 mb-3" data-toc-skip>ð¥ 주ëì´ ì±ì¥ì¼ê¸°: 2021.05.01</h3><div class="text-muted small"><p> Vue.js 를 ì²ì ì íë¤. ìë ë´ë¹íê³ ìë ì
무ì ë¤ë¥¸ íí¸ ì§íì´ ëëê² ëì´ì ë¤ë¥¸ ê°ë¨í ì
무를 ë§¡ìë¤. Vue.js를 ì¬ì©í´ì¼ íìëë°, ê·¸ëì ì¤ëì ê°ë¨í Vue.js ì í
ì¤ë¥¼ ê³µë¶íìë¤. Reactì ë¹í´ì íì¤í ë°°ì°ê¸° ì¬ì´ ì¸¡ë©´ì´ ìë ê² ê°ë¤. Reactë ì´ë¤ ê²ì 구íí ë ì¬ë¬ ë°©ë² ì¤ íëì ë°©ë²ì íí´...</p></div></div></a></div></div></div><div class="post-navigation d-flex justify-content-between"> <a href="/posts/system-deisign-01/" class="btn btn-outline-primary" prompt="Older"><p>ìì¤í
ëìì¸ ê°ë
ì 리: Latency, Throughput, CDN, Availability</p></a> <span class="btn btn-outline-primary disabled" prompt="Newer"><p>-</p></span></div><div id="disqus" class="pt-2 pb-2"><p class="text-center text-muted small pb-5"> Loading comments from <a href="https://disqus.com/">Disqus</a> ...</p></div>
35<script src="/assets/js/lib/jquery.disqusloader.min.js"></script>
35
35<script> const options = { scriptUrl: '//hayeon17kim-github-io.disqus.com/embed.js', disqusConfig: function() { this.page.title = 'ìºì ì ëµ'; this.page.url = 'https://hayeon17kim.github.io//posts/cache/'; this.page.identifier = '/posts/cache/'; } }; $.disqusLoader('#disqus', options); </script>
35</div></div></div>
35<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/lozad/dist/lozad.min.js"></script>
35
35<script type="text/javascript"> const imgs = document.querySelectorAll('.post-content img'); const observer = lozad(imgs); observer.observe(); </script>
35<footer class="d-flex w-100 justify-content-center"><div class="d-flex justify-content-between align-items-center"><div class="footer-left"><p class="mb-0"> © 2022 <a href="https://twitter.com/MONI56219559">hayeon_kim</a>. <span data-toggle="tooltip" data-placement="top" title="Except where otherwise noted, the blog posts on this site are licensed under the Creative Commons Attribution 4.0 International (CC BY 4.0) License by the author.">Some rights reserved.</span></p></div><div class="footer-right"><p class="mb-0"> Powered by <a href="https://jekyllrb.com" target="_blank" rel="noopener">Jekyll</a> with <a href="https://github.com/cotes2020/jekyll-theme-chirpy" target="_blank" rel="noopener">Chirpy</a> theme.</p></div></div></footer></div><div id="search-result-wrapper" class="d-flex justify-content-center unloaded"><div class="col-12 col-sm-11 post-content"><div id="search-hints"><h4 class="text-muted mb-4">Trending Tags</h4><a class="post-tag" href="/tags/java/">java</a> <a class="post-tag" href="/tags/javascript/">JavaScript</a> <a class="post-tag" href="/tags/bitcamp/">bitcamp</a> <a class="post-tag" href="/tags/modernjs/">modernJS</a> <a class="post-tag" href="/tags/project/">project</a> <a class="post-tag" href="/tags/algorithm/">algorithm</a> <a class="post-tag" href="/tags/trouble-shooting/">trouble shooting</a> <a class="post-tag" href="/tags/devil/">devil</a> <a class="post-tag" href="/tags/corejs/">corejs</a> <a class="post-tag" href="/tags/network/">network</a></div><div id="search-results" class="d-flex flex-wrap justify-content-center text-muted mt-3"></div></div></div></div><div id="mask"></div><a id="back-to-top" href="#" aria-label="back-to-top" class="btn btn-lg btn-box-shadow" role="button"> <i class="fas fa-angle-up"></i> </a>
35<script src="https://cdn.jsdelivr.net/npm/[email protected]/dest/simple-jekyll-search.min.js"></script>
35
35<script> SimpleJekyllSearch({ searchInput: document.getElementById('search-input'), resultsContainer: document.getElementById('search-results'), json: '/assets/js/data/search.json', searchResultTemplate: '<div class="pl-1 pr-1 pl-sm-2 pr-sm-2 pl-lg-4 pr-lg-4 pl-xl-0 pr-xl-0"> <a href="https://hayeon17kim.github.io/{url}">{title}</a><div class="post-meta d-flex flex-column flex-sm-row text-muted mt-1 mb-1"> {categories} {tags}</div><p>{snippet}</p></div>', noResultsText: '<p class="mt-5">Oops! No result founds.</p>', templateMiddleware: function(prop, value, template) { if (prop === 'categories') { if (value === '') { return `${value}`; } else { return `<div class="mr-sm-4"><i class="far fa-folder fa-fw"></i>${value}</div>`; } } if (prop === 'tags') { if (value === '') { return `${value}`; } else { return `<div><i class="fa fa-tag fa-fw"></i>${value}</div>`; } } } }); </script>
vendor: 1 bytes, line 35
35
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.