웹개발자면서 이것도 모름? | DOM과 CSSOM, 렌더링 과정

Поділитися
Вставка
  • Опубліковано 25 січ 2025

КОМЕНТАРІ • 43

  • @코딩알려주는누나
    @코딩알려주는누나  Рік тому +4

    오늘은 브라우저의 동작 원리에 대해 살펴봅시다!
    00:00 인트로
    01:38 브라우저의 구조
    04:50 1. naver.com을 입력하는순간 어떤일이 벌어질까? DNS란?
    08:18 2. 리소스 요청
    10:14 3. 토큰화
    12:09 4. 노드
    13:22 5. DOM tree
    15:22 6. CSSOM tree
    18:21 7. 자바스크립트태그가 항상 바닥에 있는 이유
    21:36 defer과 async
    22:20 왜 CSS link태그는 항상 위에 있는거야?
    24:34 8. Render tree
    26:25 9. layout
    27:40 10. paint & composite
    30:28 웹사이트에 성능을 좋게하려면 어떻게 해야할까?
    HTML CSS 강의듣는 곳
    codingnoona.thinkific.com/courses/f3851d
    뇌를 살찌우러 올래?

  • @stravinskky
    @stravinskky 2 місяці тому

    의인화 시켜서 설명해주니까 설명이 쏙쏙쏙쏙쏙쏙쏙쏙 들어와요. 그리고 굉장히 디테일하게 잘 알려주셔서 감사해여

  • @sonice500
    @sonice500 Рік тому +6

    참.. 설명 잘하시네요 멋진 선생님

  • @유니-m5o
    @유니-m5o 9 місяців тому +1

    설명도 너무 잘해주시고 자료도 너무 깔끔해서 금방 이해했어요 !!!!!!!! 정말 감사합니다 ㅠ_ㅠ

  • @wind701014
    @wind701014 2 місяці тому

    강의 너무 감사합니다.

  • @박인국-x2s
    @박인국-x2s Рік тому +1

    코알누님, 증말증말 감사합니다. 강의 넘 재밌어요!

  • @juchoi6023
    @juchoi6023 Рік тому +1

    강의 폼 미쳤다. 감사합니다 누님

  • @vbn0213
    @vbn0213 Рік тому +1

    오랜만에 보니까 좋네요 ㅎㅎ 내용도 시각화를 잘 해주셔서 이해가 잘돼용 항상 감사해요 :)

  • @개발하는약사
    @개발하는약사 Рік тому

    강의 전달력이 뛰어나시네요! 훌륭한 자료 감사합니다!

  • @Busan_YeonSandong
    @Busan_YeonSandong Рік тому +2

    유익한 강의 감사합니다 ^^

  • @bebe7176
    @bebe7176 Рік тому

    부분부분 쪼개져있던 작은 지식들이 선생님 강의듣고 정리가 되면서 하나의 큰 그림으로 완성되는 기분이었어요. 항상 최고의 강의 감사합니다 ❤

  • @종현이-t7w
    @종현이-t7w Рік тому

    따따봉 있으면 누를텐데, 따봉 밖에 없어서 아쉬울만큼 멋진 교육이였습니다.

  • @Lee렐루
    @Lee렐루 5 місяців тому

    역시 너무 잘가르쳐주시는군요..

  • @박준범-s6e
    @박준범-s6e Рік тому

    작년에 학원에서 처음 접했다가 이제서야 이해가 되네요!!

  • @eunkyongchoi5254
    @eunkyongchoi5254 10 місяців тому

    부트캠프 중인데 너무 힘들어서 ㅜ 코알누님꺼 보고 머리 식히고 있어요..! 장고 배우고 있는데 이거 보고 좀 리마인드할게요....푸잉 감사해요

  • @dbdbdbdiv
    @dbdbdbdiv Рік тому

    복잡하고 긴 흐름을 정리해주셔서 감사합니다!! 이 다음 영상은 React.js 의 V-DOM 에 대한 내용이겠네요 !!

  • @sterben5819
    @sterben5819 4 місяці тому

    영상 내용은 사파리, 파이어폭스, 크롬, 브레이브 등 모든 브라우저에 적용되는 내용인가요?

  • @sangdol-ef4gg
    @sangdol-ef4gg 8 місяців тому +1

    9:35 바이트 형태를 인코딩하는게 아니라, 디코딩하는거 아닌가요? 개념이 헷갈려서 질문드립니다!

    • @user-tj8nj3hr6f
      @user-tj8nj3hr6f 7 місяців тому

      저도 이 부분 설명이 잘못된 것 같아 gpt한테 캐물어봤는데 인코딩된 바이트 스트림을 해석 가능한 형태로 디코딩하는게 맞는 표현 같네요

  • @y_minseok06
    @y_minseok06 Рік тому +2

    최고

  • @이준한-g5q
    @이준한-g5q Рік тому

    좋은 강의 감사합니다!
    Token과 Node의 차이점을 조금 더 자세히 설명해주실 수 있을까요?

  • @Sanginjeongzzz
    @Sanginjeongzzz Рік тому

    코드를 잘짜는지 그런거 잘모르겠지만 강의를 잘하냐로봤을때 누나가 짱이야

  • @CHPark-wg9rq
    @CHPark-wg9rq Рік тому

    굿입니다~~!😂^^

  • @yangseungtoung
    @yangseungtoung Рік тому

    ㅠㅠ저는 크쏘옴! 이라고 읽는데 쏨이 더 맞는 것 같아요. 많이 배우고 갑니다..

  • @seongwono6269
    @seongwono6269 10 місяців тому

    누나... 최고야...

  • @histori4731
    @histori4731 8 місяців тому

    DOMContentLoaded, load 이벤트는 저 과정 중 어디에서 발생할까요?

  • @jhkim8510
    @jhkim8510 Рік тому

    잘배웠어요 감사합니다

  • @min-hj6nd
    @min-hj6nd Рік тому

    멋지네요.ㅋㅋ

  • @dowpaw
    @dowpaw 7 місяців тому

    css link 도 dom 의 생성을 막는 걸로 알고있는데 아닌가요?

  • @olimolim6556
    @olimolim6556 Рік тому

    레전드

  • @zuny25
    @zuny25 Рік тому +1

    면접때 많이 물어보는 질문이죠

  • @파부
    @파부 Рік тому

    안녕하세요 백엔드 개발자 준비하는 학생인데, 공부도 할 겸 블로그에 내용을 정리해서 올리고 싶습니다.
    출처를 밝히고 영상 화면을 캡쳐해서 같이 올려도 될까요?

  • @항별-w9m
    @항별-w9m Рік тому +2

    15:43

  • @odd-o1x
    @odd-o1x Рік тому

    손이 예쁘시네요

  • @jaecheonlee5319
    @jaecheonlee5319 Рік тому

    야 내가 저 질문 받음 떨어지는 건 알겠는데 난 모르는.. 너 님이 설명해주면 매우 감사하겄다 하는 심정으로 되물을거 같음

  • @user-nd7vq3qs3d
    @user-nd7vq3qs3d Рік тому

    누나 이뻐요

  • @jwonchi
    @jwonchi 11 місяців тому

    바이트 스트림으로 준다고???? 진짜?