layout 속성
종류
- 'layout:decorate' : 속성을 사용하여 레이아웃페이지 지정
* 전체 레이아웃을 적용하여 페이지 꾸밈 가능
* 레이아웃이 복잡할 경우 유지 관리 어려움 가능, 일부 속성 충돌
* 다른 속성과 충돌하지 않도록 주의
* 중첩될 경우 오류 발생
ex)
<html layout:decorate="~{layout}">
<head>
<title>My Page</title>
</head>
<body>
<div layout:fragment="content">
내용 내용 내용
</div>
</body>
</html>
- 'layout:include' : 다른 페이지의 내용을 현재 페이지에 포함 즉, 다른 페이지의 내용을 현재 페이지 삽입가능
* 코드 재사용성 향상
* 관리 어려움
* 충돌 주의
* 너무 많은 사용은 페이지 로딩 속도 저하
ex) <div layout:include="~{components :: header}"></div>
- 'layout:fragment' : 페이지 내의 특정 부분을 프래그먼트로 지정가능
* 재사용 가능, 유지 관리 용이
* 프래그먼트 이름 충돌 주의
* 사용이 많을 경우 코드 가독성 해칠 가능성 있음
* 반복적으로 사용되는 부분이 있을때 용이
- 'layout:insert' : 현재 페이지의 내용을 다른 페이지의 내용 삽입 ,'layout:replace'와 비슷하지만, 여기서는 현재 내용을 유지하면서 다른 페이지 내용 추가
ex) <div layout:fragment="header">
<h1>헤더</h1>
</div>
- 'layout:replace'
* 특정 부분을 다른 페이지의 내용으로 교체 가능
* 유연한 레이아웃 구성 가능
* 페이지 구조가 복잡할 경우 유지 관리 어려움
* 대체되는 내용이 예상과 다를 경우 레이아웃 깨짐 주의
* 중복 대체 피하기
* 특정 부분만 다른 형태로 변경할 때 사용
ex) <div layout:replace="~{components :: footer}"></div>
이 외에도 많으니 나중에 더 자세히 공부하자!