개발/티스토리
티스토리 블로그 자동으로 키워드 링크 매칭하기
티스토리와 같은 블로그에서 글을 쓰다보면 키워드에 지난 글 링크를 걸어야 할 때가 많다. 보통 이럴 때는 다음과 같은 과정을 거치게 된다. 키워드와 관련된 지난 글을 찾는다. 지난 글의 링크를 복사한다. 에디터로 돌아와 지난 글의 링크를 건다. 그런데 이는 키워드가 많아지면 상당히 귀찮은 일이 되며, 또 지난 번에 어떤 글을 썼는지 모두 기억하고 있기도 쉽지가 않다. 이를 자동으로 매칭할 수 있는 방법은 없을까? 다음 자바스크립트 코드를 사용하면 블로그 콘텐츠의 내용을 글자별로 뽑아 자동으로 링크를 걸 수 있다. 이를 위해서는 키워드와 이에 해당하는 링크를 매핑시켜줘야 하는데, 한 번 설정한 다음에는 각 본문에 처음으로 등장하는 해당 키워드가 링크 태그로 바뀌게 된다. document.addEventLi..
티스토리에서 LazyLoading 구현하는 방법
티스토리와 같은 블로그 플랫폼에서는 이미지를 많이 사용하는 경우가 빈번하기 때문에 레이지 로딩(LazyLoading)을 필수적으로 구현해두는 것이 좋다. 이번 글에서란 레이지 로딩이란 무엇이며 이를 사용하는 이유와 더불어 이를 구현하는 코드를 정리해보려고 한다. 레이지 로딩이란? 레이지 로딩이란 사용하지 않는 리소스(예: 이미지)를 식별하여 필요할 때만 로드하는 방식이다. 그렇다면 레이지 로딩을 사용하는 이유는 무엇일까? 예를 들어, 블로그 이미지 하단에 있는 이미지는 굳이 처음부터 로딩할 필요가 없다. 레이지 로딩을 사용하는 이유는 누군가는 블로그 하단까지 글을 읽지 않을 수도 있으며, 또 당장 필요한 리소스가 아니기 때문이다. 이러한 문제점을 해결하기 위해 레이지 로딩은 중요한 리소스만을 먼저 불러온..
