HTML에서는 크게 두가지 태그로 범위가 나뉜다. <head>와 <body>. 그렇다면 각각의 태그는 무엇들을 담고 있을까?

<!DOCTYPE html>
<html>
    <head>
        <!-- Metadata goes here -->
    </head>
    <body>
        <!-- Content goes here -->
    </body>
</html>
  • <head> : 해드 테그는 페이지에 있는 모든 메타 데이터들을 포함한다.
  • <body> : 최종 유저에게 보여지는 콘텐츠들을 포함한다.(즉, 화면에 보여지는 요소들을 담고있다.)

그렇다면, 여기서 말하는 페이지에 있는 "메타 데이터" 란 무엇일까?

 

메타데이터는 데이터에 관한 정보를 나타내는 데이터를 말한다. 즉, 데이터의 특성, 구조, 내용 등을 설명하는 데이터이다. 메타데이터는 주로 다른 데이터를 설명하거나 분류하는 데 사용된다. 예를 들면:

1. **도서관 카탈로그의 메타데이터:** 책의 제목, 저자, 출판사, 출판일 등의 정보로 구성되어 있다. 이 메타데이터는 실제 책 자체가 아니라 책에 대한 정보이다.
2. **음악 파일의 메타데이터:** 노래 제목, 가수, 앨범, 장르 등의 정보가 음악 파일에 저장되어 있다. 이 메타데이터는 음악 파일 자체가 아니라 음악에 대한 정보이다.
3. **사진 파일의 메타데이터:** 사진의 촬영 일시, 카메라 모델, 해상도 등의 정보가 포함된다. 이 메타데이터는 사진 파일이 아니라 사진에 대한 정보이다.
4. **웹 페이지의 메타데이터:** HTML 문서에서 사용되는 메타 태그는 웹 페이지의 제목, 설명, 작성자 등을 정의한다. 이 정보는 브라우저나 검색 엔진이 웹 페이지를 이해하고 적절히 표시하도록 도와준다.


간단한 예를 들어보자. 위의 설명에서 웹 페이지의 제목, 설명이라고 표현 하였는데, 웹 페이지의 제목(메타 데이터)를 코드로 한번 보자.

<head>
    <title>Jay's Developer Note</title>
</head>

 

위에서 언급한 <head>태그로 감싸진 부분 안에 <title>이라는 태그로 감싸고 그 사이에 타이틀을 넣는다. 그러면 저 타이틀은 내가 만들 웹사이트의 타이틀이 될것이다. 저 타이틀은 헤드태그로 감싸고 타이틀이란 태그 안에 감쌌기 때문에, 단순한 텍스트 타입 타이틀이 아니라 다른 웹사이트들과 구분될 수 있는 타이틀이다.

 

<body>태그 안의 여러가지 다른 태그 알아보기

 

  • Page headings
    • 페이지 헤딩이란 <h1>,<h2>...<h6>까지 있는 페이지 헤딩을 나타낼 수 있는 태그이다. 1부터 6까지 글자의 크기가 달라지기때문에 더 중요한 부분은 h1으로 감싸면 웹 페이지에서 더 돋보일 수 있다.
  • Adding Text
    • 그러면 헤딩과는 별개로 일반 문자들을 추가하고싶다면 어떻게 할까? 그때는 'paragraph'의 약자인 <p></p> 태그로 감싸준다.
  • External Link
    • 만약에 웹에 다른 페이지로 이동 할 수 있는 링크를 걸고싶다고 해보자. 이러한 경우에는 링크를 감싸는 태그가 따로 있다. 아래처럼 a태그로 시작한 다음 href= "안에 링크를 걸어두고> 그 다음에 링크가 표시 될 문자를 적어준다.
 <a href="https://www.ibm.com">IBM</a>

위의 텍스트는 웹 페이지에서 이렇게 보일 것이다. IBM. 이제 웹 페이지에서 저 IBM이라는 글자를 누르면 href안의 url로 이동한다.

 

그런데 여기서 한가지 기능이 더 있다. 아래 코드를 살펴보자.

 

 <a href="https://www.ibm.com" target="_blank">IBM</a>

첫번째 링크 코드와는 달리 target이라는 인자가 추가되었다. 위의 코드는 링크를 새로운 창에서 열어준다는 뜻이다. 즉, 첫번째 코드는 링크를 누르면 현재 페이지에서 바로 링크가 눌린다는 얘기이고, 두번째 코드는 새 창에다가 링크를 열어준다는 뜻이다.

 

  • 리스트

웹에서의 리스트란 무엇일까? 리스트는 말 그대로 여러가지 "목록" 들이다. 예를 들어, 쇼핑몰 페이지를 구축중이라고 해보자. "바지" 탭을 누르면 여러 종류의 바지들이 페이지에 나타날것이다. 그런데 바지들을 하나하나의 개별 요소들로 나타내기 보다는 리스트를 사용하는게 훨씬 더 직관적이고 깔끔할것이다. 아래 코드를 살펴보자.

<!-- Unordered List -->
<ul>
    <li>This is a bullet point </li>
    <li>The items in this list have no particular order </li>
    <li>Each item will appear as a bullet, rather than a number </li>
</ul>
<!-- Ordered List -->
<ol>
    <li>This is an ordered list </li>
    <li>The items in this list have a particular order </li>
    <li>Each item will be numbered, starting from 1 </li>
    <li>This is the fourth point in the list </li>
</ol>

 

`<ol>`과 `<li>`는 HTML에서 리스트를 생성하기 위한 태그이다.

1. `<ol>` (Ordered List):

   - `<ol>`은 "Ordered List"의 약어로, 순서가 있는 목록을 정의한다.
   - 기본적으로 숫자로 번호가 매겨지며, 각 아이템은 `<li>` 태그로 둘러싸여 있습니다.
   - 예를 들어, 순서가 있는 목록을 생성하고자 할 때 사용됩니다.

   <ol>
     <li>첫 번째 항목</li>
     <li>두 번째 항목</li>
     <li>세 번째 항목</li>
   </ol>
  
   결과:
   1. 첫 번째 항목
   2. 두 번째 항목
   3. 세 번째 항목

2. `<ul>` (Unordered List):

   - `<ul>`은 "Unordered List"의 약어로, 순서가 없는 목록을 정의한다.
   - 각 아이템은 역시 `<li>` 태그로 둘러싸여 있다.
   - 기본적으로 원형 또는 사각형의 마커가 사용되며, 목록의 순서에는 중요성이 없다.

   ```html
   <ul>
     <li>항목 1</li>
     <li>항목 2</li>
     <li>항목 3</li>
   </ul>
   ```

   결과:
   - 항목 1
   - 항목 2
   - 항목 3

따라서, `<ol>`은 순서가 있는 목록을 나타내고, `<ul>`은 순서가 없는 목록을 나타낸다. 어떤 목록인지에 따라 사용하면 된다.

 

테이블(표) 나타내기

 

우리가 흔히 볼 수 있는 웹 페이지에서의 테이블은 어떻게 나타낼까?

아래의 코드부터 살펴보자.

 

<table>
    <tr>
        <th>Heading 1</th>
        <th>Heading 2</th>
        <th>Heading 3</th>
    </tr>
    <tr>
        <td>H1 - Data Item 1</td>
        <td>H2 - Data Item 1</td>
        <td>H3 - Data Item 1</td>
    </tr>
    <tr>
        <td>H1 - Data Item 2</td>
        <td>H2 - Data Item 2</td>
        <td>H3 - Data Item 2</td>
    </tr>
    <tr>
        <td>H1 - Data Item 3</td>
        <td>H2 - Data Item 3</td>
        <td>H3 - Data Item 3</td>
    </tr>
</table>

 

상당히 직관적이다. 그냥 <table>태그로 감싸고, 그 안에 테이블 요소를 넣어주면 된다. 여기서의 <tr>은 table row이고, <td>는 table data, 그리고 <th>는 table heading 이다.

 

위의 코드로 만들어진 웹에서의 테이블 모습은 이렇게 생겼다.

 

 

웹에서의 테이블 모습

 

웹사이트에서 이미지 표시하기

우리가 흔히 보는 웹사이트에서의 이미지는 html로 어떻게 표현될까?

 

<!-- External Image -->
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/5/51/IBM_logo.svg/440px-IBM_logo.svg.png" alt="IBM Logo" width="300" height="300">
<!-- Local Images -->
<img src="images/IBMlogo.png" alt="IBM Logo" width="300" height="300">

이 코드는 HTML에서 이미지를 삽입하는 두 가지 방법을 보여준다. 주석(`<!-- -->`)은 코드에 설명을 추가하는 데 사용되며, 코드 실행 시에는 무시된다.

1. **External Image (외부 이미지):**
   
   <!-- External Image -->
   <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/5/51/IBM_logo.svg/440px-IBM_logo.svg.png" alt="IBM Logo" width="300" height="300">

   - `src`: 이미지 파일의 URL을 지정한다. 이 경우, 웹상에 있는 IBM 로고의 이미지 URL이다.
   - `alt`: 이미지에 대한 대체 텍스트를 지정한다. 이미지를 로드할 수 없을 때 대체 텍스트가 표시된다.
   - `width` 및 `height`: 이미지의 가로와 세로 크기를 픽셀 단위로 지정한다.

2. **Local Images (로컬 이미지):**
   <!-- Local Images -->
   <img src="images/IBMlogo.png" alt="IBM Logo" width="300" height="300">

   - `src`: 로컬에 저장된 이미지 파일의 상대 경로를 지정한다. 이 경우, "images" 폴더 내에 있는 "IBMlogo.png" 이미지를 사용한다.
   - `alt`: 이미지에 대한 대체 텍스트를 지정한다.
   - `width` 및 `height`: 이미지의 가로와 세로 크기를 픽셀 단위로 지정한다.

이렇게 이미지를 삽입하는 것은 웹 페이지에서 시각적인 콘텐츠를 표현하는 데 사용되며, 이미지는 `<img>` 태그를 사용하여 삽입된다.

'Frontend' 카테고리의 다른 글

[Javascript]자바스크립트의 함수, 오브젝트, 프로토타입  (1) 2024.01.29
[JavaScript] 자바스크립트의 변수 선언  (0) 2024.01.28
[Bootstrap] 부트스트랩이란 무엇인가?  (0) 2024.01.28
[HTML] HTML의 다른 여러가지 태그들  (0) 2024.01.28
기본적인 웹의 동작방식  (1) 2024.01.27

이번 학기에 시작한 안드로이드 개발 수업! 아직 아무것도 모르겠고 어색하지만 언제나 그래왔듯 다시 한번 시작해보겠다.

 

원래 나는 무언가를 배우기 시작할때 이론적인것부터 들이밀고 공부하라고 하면 진절머리가 나는 스타일이다. 직접 간단한 앱을 만들면서 차근차근 더 깊이 배워보도록 하겠다.

 

사용 언어는 Kotlin을 사용하고, 코틀린은 자바에 대한 이해가 있으면 코딩하기가 좀 더 수월할거라고 들었다. 다행히 자료구조 알고리즘을 자바로 배운터라 크게 걱정하진 않았다. 앱을 만드는데 쓰는 프로그램은 Android Studio를 썼고, Mac M1 pro에서 사용중이다. 이번에 만들어볼 앱은 정말 간단한 퀴즈 맵이다. 문제가 나오고 True/ False를 선택 할 수 있는 앱이다. 한번 시작해보자!

 

먼저, Android Studio를 실행하고 New Project(Empty)를 누르면 아래와 같은 창이 나온다.

 

중요한 태그 몇개만 짚고 넘어가겠다.

 

  • Name : 말 그대로 "앱 이름" 이다. 여기서는GeoQuiz라고 칭하겠다.
  • Language : 사용 언어는 위에서 말했듯 코틀린이다.
  • Minimum SDK(최소 지원 API레벨) : 이건 현재 만드려는 앱이 어디까지 지원 할 수 있는지를 나타내는 좌표인데, API뒤의 숫자가 커질수록 최신 API이며, 그만큼 현존하는 기기들과 호환되지 않는 경우가 많다. 일반적으로는 낮은 API를 사용한다.

 

그 다음, 이러한 창이 나오면 왼쪽 아래 망치버튼을 누르면 콘솔에 알 수 없는 명령어들이 나오면서 BUILD SUCCESSFUL이라는 문구가 뜬다.

 

 

왼쪽 위에 보면, project view를 설정 할 수 있는데, Android Studio의 디폴트 view는 Android view이다[개발자들이 디폴트값을 이렇게 설정 해놓은데에는 항상 이유가 있다]. Android view는 실제 진행하는 프로젝트의 디렉토리를 숨겨 우리가 현재 진행중인 안드로이드 프로젝트에만 더 집중 할 수 있도록 해준다.

 

Android view와 Project view의 차이

한눈에 봐도 왼쪽이 훨씬 더 간결해보인다.

 

그 다음, 아래와 같이 Empty Views Activity를 누른다. 되게 복잡해 보이고 처음 해보는 사람들은 헷갈리겠지만, 지금은 하나하나가 뭔지 알 필요 없다!

 

 

 

그러면 아래와 같이 처음 보는 코드들이 보일것이다. 

 

이제, 안드로이드에게 앱을 시작할때 화면에 무엇을 로드할지 알려주어야 한다. [UI 레이아웃]

 

 

그 다음, 왼쪽 에디터에 보이는 AndroidManifest.xml파일을 연다. 그러면 처음 보는 코드들이 쓰여있는데, 거기서 <activity/> 태그로 감싸진 부분을 수정해준다. 디폴트는 아래와 같지만

 

<activity
    android:name=".MainActivity"
    android:exported="false" />

 

 

다음과 같도록 수정해준다

 

<activity
    android:name=".MainActivity"
    android:exported="true">
<intent-filter>
    <action android:name="android.intent.action.MAIN" />

    <category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>

 

간단히 짚고 넘어가자면, android : exported = "false"에서 "true"로 변경한 부분과 <intent-filter>부분은 앱에게 "앱을 실행하면 MainActivity가 보여질것" 이라고 변경해준것과 같다.

 

 

다음은 app/res/layout/activity_main.xml  을 열고, 코드를 보면 디폴트 값으로 되어있는데, 이 디폴트 코드들을 아래와 같이 변경해준다.

 <?xml version="1.0" encoding="utf-8"?>
    <androidx.constraintlayout.widget.ConstraintLayout
            xmlns:android="http://schemas.android.com/apk/res/android"
            xmlns:tools="http://schemas.android.com/tools"
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            tools:context=".MainActivity">

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Hello World!"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="parent"/>

    </androidx.constraintlayout.widget.ConstraintLayout>

 

 

 

기본 값은 두가지 view가 있다. Constraint layout과 TextView. 아래는 두가지를 간단히 표현한 그림이다.

 

 

그런데 우리가 만들 앱은 단순히 텍스트 뷰만 있어서는 안된다. 우리가 만들 앱의 MainActivity는 더 많은 view들이 필요하다.

  • a vertical LinearLayout
  • a TextView
  • a horizontal LinearLayout
  • two Buttons

추가적으로 필요한 view들을 나타낸 모습

그러면 나머지 필요한 view들을 activity_main.xml파일에 추가해주자. 원래 있던 코드들은 모두 지워주고 아래처럼 작성하면 된다.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:padding="24dp"
        android:text="@string/question_text" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/true_button" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/false_button" />

    </LinearLayout>

</LinearLayout>

 

뭔가 서식들이 전에 웹 프론트엔드를 공부할때 css에서 봤던것들과 비슷해보인다.

 

그런데 여기서 문제가 하나 생긴다. 위의 코드를 작성하면 오른쪽 위에 IDE Warning이 뜰것이다. 버튼에 대한 warning인데, 여러 버튼들이 horizontal layout에 인접해 있으면 뜨는 오류이다. 해결 방법은 간단하다. 버튼 태그 안에 style="?android:buttonStyle" 만 추가해주면 된다.

 

코드를 살펴보면 Textview, Button 는 android : text라는 속성이 있다. 이 속성은 view에게 어떤 텍스트를 보여줄건지 명령하는 속성이다. 하지만 여기서 중요한 부분이 있다. 이 text속성의 값은 raw 문자열이 아닌 대신에, @string/ syntax를 이용하여 string값을 참조해야 한다. 단순히 hardcoding으로 android : text = "True" 라고 할 수 있지만, 하드코딩은 좋은 방법이 아니다(유지보수 문제). 대신 문자열을 별도의 파일에 넣고 참조하는것이 좋은 방법이다.

 

자 그럼 이제, 참조할 문자열 파일을 만들어보자!

 

모든 프로젝트는 디폴트 문자열 파일 res/values/strings.xml 이 포함되어있다. 이 파일을 열고, 우리가 view에 전달해야 할 문자열을 MainAcrtivity가 참조 할 수 있도록 문자열을 추가해주자.

 

strings.xml파일에 문자열을 더한 모습

문자열 파일은 이름이 꼭 strings가 아니여도 되고, 여러가지 문자열 파일을 만들수도 있다.(단, 무조건 res라는 상위폴더 아래에 만들어야 한다) 각 분야마다 문자열 파일을 따로 만들어 놓는다면(직관적인 문자열 파일 이름과 함께) 유지보수가 더욱 더 쉬워질 것이다.

 

그다음 이제 다시 activity_main으로 돌아가 preview를 본다면 

 

 

짜잔! 우리가 원하는 모습이 되어있다.

 

포스팅이 너무 길어지므로 다음 포스트에서 이어가도록 하겠다!

'Android' 카테고리의 다른 글

[Kotlin] 안드로이드 앱 메뉴바 아이콘 추가하기[Menu]  (0) 2024.03.27
[Kotlin] Jetpack Navigation 라이브러리 사용법  (0) 2024.03.13
[Kotlin]ViewModel 이해하기  (0) 2024.01.31
[Kotlin]viewBinding을 통한 레이아웃  (0) 2024.01.24
[Kotlin]Android Studio를 이용한 간단한 퀴즈 앱 만들기 pt.2  (0) 2024.01.20

이번에는 캐시 일관성 에 대해 알아보자. 
 
캐시 일관성이란 멀티코어 프로세싱에서 자주 등장하는 개념인데, 한마디로 말해 여러 캐시의, 즉 하나 이상의 캐시의 데이터 불일치를 나타내는 용어이다.
 
예를 한번 들어보자.

위의 예시는 두개의 코어가 있다고 가정한다.
 
예를 들어, 메모리 주소 0x1234ABCD에 X = 1이라는 데이터가 있다고 해보자.
그 다음, CPU1에서 0x1234ABCD에 저장되어 있는 X변수를 읽어오고싶다고 해보자. 그러면 1이 읽힐 것이다. 그러면 이제 CPU2에서 같은 주소로 내려가 X를 읽는다고 해보자. 그러면 버스에서는 메인 메모리의 0x1234ABCD에 있는 X에 접근하여 1을 읽어올것이다. 이 상황에서는 문제가 없다.
 
하지만, 
 
CPU2에서 이제 X에 1 대신 2를 쓴다고 해보자. 이렇게 되면, CPU1과 CPU2가 바라보는 X값은 다를 것이다. 즉, 어떤 값이 유효한 값인지 알 수 없다. 
 
위 그림이 이해가 안된다면 아래는 캐시 일관성 문제를 표현한 테이블이다.

 
맨 왼쪽 열에 있는 Time step은 동작이 수행되는 과정을 시간별로 분류한것이다.
 
0. X에는 0이라는 정수가 존재한다.
1. CPU A는 X값을 메모리에서 읽어온다 => 0을 읽어와 캐시에 저장할것이다.
2. CPU B도 X값을 메모리에서 읽어온다 => 0을 읽어와 캐시에 저장할것이다.
(이 시점에서 두개의 캐시 A,B에는 각각 X에서 읽어온 0이라는 값이 저장된다.)
3. CPU A는 X값을 1로 바꾼다. 이때, 메모리에서 X는 1을 가지고 있다.
 
같은 문제가 발생한다. 어느 캐시에 있는 X값이 올바른 X값일까?
 
여기서 일관성 문제를 해결하기 위해 아래 세가지 상태변수가 등장한다.
 

  • Invalid[0]
  • Shared[1]
  • Exclusive[1]

 
※Invalid : 여러개의 프로세서중 하나의 프로세서에서 어느 한 메모리 주소에 "쓰기" 요청을 할때, 현재 쓰기 요청을 하는 프로세서를 제외한 모든 프로세서를 invalid(무효화) 하게 만드는것이다. 예를 들어, 위의 예시에서 CPU A가 X에 쓰기 요청을 한다면, A는 버스를 통해 다른 프로세서들에게 "내가 지금 X값을 변경하고 있으니 너희 나머지 모두들의 X값을 무효화 시킬게. 만약 너가 X를 바꾸거나 읽고 싶다면, 다시 메인 메모리로 돌아가 업데이트된 X값을 가져와서 처리해" 라는 동작이다. [쓰기 전용]
 
※ Exclusive : 위의 예시에서, 이제 A를 제외한 다른 프로세서들은 모두 invalid상태에 머물러 있다. 그렇다면 A는 무슨 상태일까? A는 여기서 Exclusive(독점적인) 상태이다. "오직" A만이 X의 값을 변경하거나 읽을 수 있는 상태라는 말이다.
 
※ Shared : invalid나 Exclusive한 상태가 아닌 상태이며, "안전하게" 즉, 캐시 블럭을 문제 앖이 읽어올수 있다는 뜻이다. [읽기 전용]

예시를 들어보자.
1. 메모리의 X에는 0이라는 정수가 저장되어 있다.
2. A가 X를 읽어온다(캐시에는 아무것도 없는 상태이므로 캐시 미스 발생), 0을 읽어와 캐시에 저장한다.
3. B가 X를 읽어온다(캐시에는 아무것도 없는 상태이므로 캐시 미스 발생), 0을 읽어와 캐시에 저장한다.
4. A는 X에 원래 있던 0이라는 값 대신 1을 쓴다(이 시점에서 A는 Exclusive를 가지고, 캐시 B에 있던 X값(0)은 무효화(invalidate)된다).
5.B가 이제 X를 읽어온다. 그러면 B는 업데이트 된 1을 제대로 읽어올것이다.(이때, Exclusive했던 A는 더이상 Exclusive하지 않게 된다.)
 
 

'컴퓨터 구조 + 운영체제(OS)' 카테고리의 다른 글

[OS]프로세스 상태와 계층구조  (1) 2024.02.01
운영체제 pt 1. 운영체제(Operating System)의 기초(System call)  (0) 2024.01.18
병렬 컴퓨팅(Parallel Computing)  (0) 2023.12.04
가상 메모리(Virtual Memory)와 TLB 의 개념  (1) 2023.11.30
컴퓨터 캐시의 동작 과정  (0) 2023.11.29

※병렬 컴퓨팅(Parallel Computing) 이란 무엇일까?

 

하나의 컴퓨터 또는 프로세서가 아니라 여러개의 컴퓨터나 프로세서가 동시에 일처리를 하여 작업 속도를 향상시키는것을 말한다.

 

- 멀티코어 프로세서(intel Core i7, i9) : 여러개의 독립적인 프로세서들이 하나의 칩(CPU,GPU, 메모리) 안에 내장되어 있고, 병렬적으로 작업 수행이 가능하다. 예를들어, 네개의 코어가 있는 프로세서는 네개의 각기 다른 작업들을 독립적으로 처리 할 수 있게 해준다.

 

 

멀티프로세서(UMA)를 표현한 그림

위의 구조를 맨 위부터 자세히 살펴보자.

 

1. 프로세서 : 작업을 요청하는 곳이다. 프로세서가 작업을 요청하면, 원하는 작업이 캐시에 있는지 확인하러 캐시 레벨로 내려간다.

 

2. 캐시 : 캐시는 앞 글에서 설명했다. 모른다면 다시 글을 읽고 꼭 다시 보고 넘어가자!

 

3. Interconnection Network : 편하게 BUS라고 부른다. 이 버스는 컴퓨터 내부의 다양한 구성 요소들이 데이터를 주고 받을 수 있는 "통로" 라고 생각하면 편하다. 위 그림에서의 버스는 SRAM 과 DRAM과의 정보 전처리를 담당하는 역할을 한다. 버스의 속도와 너비는 컴퓨터의 성능과 효율에 큰 영향을 미치며, SRAM과 DRAM의 효율적인 통신을 위해 사용된다.

 

위 그림처럼 여러개의 프로세서가 있고, 각 프로세서는 독립적은 캐시를 가지고 있으며, 버스를 통해 DRAM과 상호작용 한다.

 

그러면 내가 위 그림 설명에서 UMA라고 하였는데, UMA는 무엇일까?

 

  • UMA(Uniform)

여기서의 uniform은 무엇을 의미하는것일까?

 

위의 UMA 그림을 다시 살펴보자. 여기서 첫번째 프로세서가 동작하는 방식은 대략 이렇다.

 

1. 프로세서에서 작업(데이터) 요청

2. 캐시 방문(캐시 히트/ 미스) [이 상황에서는 캐시 미스라고 하겠다]

3. 버스에게 메시지 전달 ("1번 프로세서에서 캐시 미스! DRAM에서 요청한 메모리를 가져다 주기 바람!")

4. 메시지를 들은 버스는 DRAM에서 프로세서가 요청한 데이터를 "복사" 하여 다시 캐시로 올려준다. 

 

이러한 일련의 작업들은 모든 프로세서에서 동일하게(uniform) 수행된다.

 

 

 

'컴퓨터 구조 + 운영체제(OS)' 카테고리의 다른 글

운영체제 pt 1. 운영체제(Operating System)의 기초(System call)  (0) 2024.01.18
캐시 일관성(Cache coherence)  (1) 2023.12.05
가상 메모리(Virtual Memory)와 TLB 의 개념  (1) 2023.11.30
컴퓨터 캐시의 동작 과정  (0) 2023.11.29
Memory Hierarchy(컴퓨터의 메모리 구조)  (2) 2023.11.28

+ Recent posts

티스토리툴바