더 빠른 성능의 KaTeX
한창 MathJax를 써오다가 속도하락을 경험한 후,
더 빠른 KaTeX를 알게되었다.
티스토리 HTML편집에서 <head> 사이에 아래와 같이 집어넣었다.
auto-render extension이 왜 따로 필요한지는 모르겠다.
<!-- KaTeX -->
<!-- KaTeX requires the use of the HTML5 doctype. Without it, KaTeX may not render properly -->
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/katex@0.16.0/dist/katex.min.css"
integrity="sha384-Xi8rHCmBmhbuyyhbI88391ZKP2dmfnOl4rT9ZfRI7mLTdk1wblIUnrIq35nqwEvC"
crossorigin="anonymous">
<!-- The loading of KaTeX is deferred to speed up page rendering -->
<script
defer src="https://cdn.jsdelivr.net/npm/katex@0.16.0/dist/katex.min.js"
integrity="sha384-X/XCfMm41VSsqRNQgDerQczD69XqmjOOOwYQvr/uuC+j4OPoNhVgjdGFwhvN02Ja"
crossorigin="anonymous">
</script>
<!-- To automatically render math in text elements, include the auto-render extension: -->
<script
defer src="https://cdn.jsdelivr.net/npm/katex@0.16.0/dist/contrib/auto-render.min.js"
integrity="sha384-+XBljXPPiv+OzfbB3cVmLHf4hdUFHlWNZN5spNQ7rmHTXpd7WvJum6fIACpNNfIR"
crossorigin="anonymous"
onload="renderMathInElement(document.body);">
</script>
<script>
document.addEventListener("DOMContentLoaded", function(){
renderMathInElement(document.body, {
delimiters: [
{left: "$$", right: "$$", display: true},
{left: "$", right: "$", display: false}
]
});
});
</script>사용법
인라인은 $로 감싸고, 블록 표기는 $$로 감싼다.
$ 1+1=2 $
$$ 1+2 = 3 $$$ 1+1=2 $
$$ 1+2 = 3 $$
'IT' 카테고리의 다른 글
| [백준 10815] 이분 탐색법(binary search) (0) | 2022.06.24 |
|---|---|
| [백준 2609] 최대공약수와 최소공배수 (0) | 2022.06.21 |
| [백준 20353] C언어 기본 자료형 정리 (0) | 2022.06.16 |
| [MySQL 02] SQL 쿼리문 (0) | 2022.06.15 |
| [MySQL 01] 우분투 접속 문제 해결 (2) | 2022.06.15 |