해시뱅 #

오늘은 해시뱅에 대해 공부해봤습니다.

우선 웹에서 사용하는 #에 대해 알아보겠습니다.

stach overflow에 검색을 해봤습니다.

Ajax가 나오기 전부터 url에 사용됬다고 하는군요.

그리고 또 다른 질문도 있습니다. 

8년도 더 된 글인데 예전 페북 및 트위터에서 사용하던 #!에 대해 질문하는 글입니다.

(#!)은 HTML5와 함께 소개 된 JavaScript History API를 사용할 수있는 능력으로 대체 되었다고 합니다.

왜 해시뱅이 필요한가?에 대한 글은 다음 링크에 있습니다.

해시뱅이 필요한 이유는 단일 페이지 웹애플리케이션을 만들기 위해서입니다. 

해시뱅을 사용하는 사이트들은 전통적인 웹사이트가 아닌 웹애플리케이션이라고 보아야 합니다. 

자바스크립트의 성능이 급격히 증가한 이후에 페이지의 전체를 로딩하는 대신에 페이지를 딱 한개만 두고 자바스크립트 만으로 모든 메뉴를 다루는 것에 대한 요구사항가 생겼고 그것을 구현하기 위해서는 페이지가 갱신되지 않는 것이 중요한데 현재 기술로는 페이지 갱신없이 URL을 변경할 수 있는 방법이 없습니다.

 그렇기 때문에 페이지 갱신없이 URL이 변경되는 것처럼 보이도록 하기 위해서 해시뱅을 사용하는 것입니다. 해시뱅에서 #뒤에 이는 부분을 fragment identifier라고 부릅니다.

fragment identifier의 장단점은 다음과 같습니다.

장점

1. 어플리케이션의 상태공유, 북마크, SEO 색인

2. HTML5표준성 활용

3. 향상된 속도

단점

1. 스크립트 에러 취약

2. 광고에 붙어 있는 스크립트 위험

3. 크롤러에 탐색되지 않음

요즘에는 해시뱅을 사용한 url들을 찾기 힘들었지만

Angular를 공부하면서 #가 보여서 검색하고 공부해봤습니다.

참고

https://blog.outsider.ne.kr/698

http://cyberx.tistory.com/144

https://stackoverflow.com/questions/3009380/whats-the-shebang-hashbang-in-facebook-and-new-twitter-urls-for

https://stackoverflow.com/questions/7846073/what-is-the-shebang-hashbang-for