diff --git a/web/src/labs/marked/index.ts b/web/src/labs/marked/index.ts
index 24473a96..f06dc262 100644
--- a/web/src/labs/marked/index.ts
+++ b/web/src/labs/marked/index.ts
@@ -1,25 +1,22 @@
 import { blockElementParserList, inlineElementParserList } from "./parser";
 
-const match = (rawStr: string, regex: RegExp): number => {
-  const matchResult = rawStr.match(regex);
-  if (!matchResult) {
-    return 0;
-  }
-
-  const matchStr = matchResult[0];
-  return matchStr.length;
-};
-
 export const marked = (markdownStr: string, blockParsers = blockElementParserList, inlineParsers = inlineElementParserList): string => {
   for (const parser of blockParsers) {
-    const startIndex = markdownStr.search(parser.regex);
-    const matchedLength = match(markdownStr, parser.regex);
+    const matchResult = parser.matcher(markdownStr);
+    if (!matchResult) {
+      continue;
+    }
+    const matchedStr = matchResult[0];
+    const retainContent = markdownStr.slice(matchedStr.length);
 
-    if (startIndex > -1 && matchedLength > 0) {
-      const prefixStr = markdownStr.slice(0, startIndex);
-      const matchedStr = markdownStr.slice(startIndex, startIndex + matchedLength);
-      const suffixStr = markdownStr.slice(startIndex + matchedLength);
-      return marked(prefixStr, blockParsers, inlineParsers) + parser.renderer(matchedStr) + marked(suffixStr, blockParsers, inlineParsers);
+    if (parser.name === "br") {
+      return parser.renderer(matchedStr) + marked(retainContent, blockParsers, inlineParsers);
+    } else {
+      if (retainContent === "") {
+        return parser.renderer(matchedStr);
+      } else if (retainContent.startsWith("\n")) {
+        return parser.renderer(matchedStr) + marked(retainContent.slice(1), blockParsers, inlineParsers);
+      }
     }
   }
 
@@ -27,27 +24,31 @@ export const marked = (markdownStr: string, blockParsers = blockElementParserLis
   let matchedIndex = -1;
 
   for (const parser of inlineParsers) {
+    const matchResult = parser.matcher(markdownStr);
+    if (!matchResult) {
+      continue;
+    }
+
     if (parser.name === "plain text" && matchedInlineParser !== undefined) {
       continue;
     }
 
-    const startIndex = markdownStr.search(parser.regex);
-    const matchedLength = match(markdownStr, parser.regex);
-
-    if (startIndex > -1 && matchedLength > 0) {
-      if (!matchedInlineParser || matchedIndex > startIndex) {
-        matchedIndex = startIndex;
-        matchedInlineParser = parser;
-      }
+    const startIndex = matchResult.index as number;
+    if (matchedInlineParser === undefined || matchedIndex > startIndex) {
+      matchedInlineParser = parser;
+      matchedIndex = startIndex;
     }
   }
 
   if (matchedInlineParser) {
-    const matchedLength = match(markdownStr, matchedInlineParser.regex);
-    const prefixStr = markdownStr.slice(0, matchedIndex);
-    const matchedStr = markdownStr.slice(matchedIndex, matchedIndex + matchedLength);
-    const suffixStr = markdownStr.slice(matchedIndex + matchedLength);
-    return prefixStr + matchedInlineParser.renderer(matchedStr) + marked(suffixStr, [], inlineParsers);
+    const matchResult = matchedInlineParser.matcher(markdownStr);
+    if (matchResult) {
+      const matchedStr = matchResult[0];
+      const matchedLength = matchedStr.length;
+      const prefixStr = markdownStr.slice(0, matchedIndex);
+      const suffixStr = markdownStr.slice(matchedIndex + matchedLength);
+      return prefixStr + matchedInlineParser.renderer(matchedStr) + marked(suffixStr, [], inlineParsers);
+    }
   }
 
   return markdownStr;
diff --git a/web/src/labs/marked/marked.test.ts b/web/src/labs/marked/marked.test.ts
index 01c211cd..da33e3bc 100644
--- a/web/src/labs/marked/marked.test.ts
+++ b/web/src/labs/marked/marked.test.ts
@@ -7,20 +7,13 @@ describe("test marked parser", () => {
   test("horizontal rule", () => {
     const tests = [
       {
-        markdown: `To create a horizontal rule, use three or more asterisks (***), dashes (---), or underscores (___) on a line by themselves.
----
+        markdown: `---
 This is some text after the horizontal rule.
 ___
 This is some text after the horizontal rule.
 ***
 This is some text after the horizontal rule.`,
-        want: `<p>To create a horizontal rule, use three or more asterisks (<em>*</em>), dashes (---), or underscores (___) on a line by themselves.</p>
-<hr>
-<p>This is some text after the horizontal rule.</p>
-<hr>
-<p>This is some text after the horizontal rule.</p>
-<hr>
-<p>This is some text after the horizontal rule.</p>`,
+        want: `<hr><p>This is some text after the horizontal rule.</p><hr><p>This is some text after the horizontal rule.</p><hr><p>This is some text after the horizontal rule.</p>`,
       },
     ];
     for (const t of tests) {
@@ -42,9 +35,7 @@ hello world!
 \`\`\`js
 console.log("hello world!")
 \`\`\``,
-        want: `<p>test code block</p>
-<p></p>
-<pre><code class="language-js"><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">"hello world!"</span>)
+        want: `<p>test code block</p><br><pre><code class="language-js"><span class="hljs-variable language_">console</span>.<span class="hljs-title function_">log</span>(<span class="hljs-string">"hello world!"</span>)
 </code></pre>`,
       },
     ];
@@ -59,9 +50,7 @@ console.log("hello world!")
         markdown: `My task:
 - [ ] finish my homework
 - [x] yahaha`,
-        want: `<p>My task:</p>
-<p class='li-container'><span class='todo-block todo' data-value='TODO'></span><span>finish my homework</span></p>
-<p class='li-container'><span class='todo-block done' data-value='DONE'>✓</span><span>yahaha</span></p>`,
+        want: `<p>My task:</p><p class='li-container'><span class='todo-block todo' data-value='TODO'></span><span>finish my homework</span></p><p class='li-container'><span class='todo-block done' data-value='DONE'>✓</span><span>yahaha</span></p>`,
       },
     ];
 
@@ -75,9 +64,7 @@ console.log("hello world!")
         markdown: `This is a list
 * list 123
 1. 123123`,
-        want: `<p>This is a list</p>
-<p class='li-container'><span class='ul-block'>•</span><span>list 123</span></p>
-<p class='li-container'><span class='ol-block'>1.</span><span>123123</span></p>`,
+        want: `<p>This is a list</p><p class='li-container'><span class='ul-block'>•</span><span>list 123</span></p><p class='li-container'><span class='ol-block'>1.</span><span>123123</span></p>`,
       },
     ];
 
@@ -88,8 +75,8 @@ console.log("hello world!")
   test("parse inline element", () => {
     const tests = [
       {
-        markdown: `Link: [baidu](https://baidu.com)`,
-        want: `<p>Link: <a class='link' target='_blank' rel='noreferrer' href='https://baidu.com'>baidu</a></p>`,
+        markdown: `Link: [baidu](https://baidu.com#1231)`,
+        want: `<p>Link: <a class='link' target='_blank' rel='noreferrer' href='https://baidu.com#1231'>baidu</a></p>`,
       },
     ];
 
@@ -112,8 +99,8 @@ console.log("hello world!")
   test("parse plain link", () => {
     const tests = [
       {
-        markdown: `Link:https://baidu.com`,
-        want: `<p>Link:<a class='link' target='_blank' rel='noreferrer' href='https://baidu.com'>https://baidu.com</a></p>`,
+        markdown: `Link:https://baidu.com#1231`,
+        want: `<p>Link:<a class='link' target='_blank' rel='noreferrer' href='https://baidu.com#1231'>https://baidu.com#1231</a></p>`,
       },
     ];
 
@@ -162,8 +149,34 @@ console.log("hello world!")
       {
         markdown: `　　line1
 　　line2`,
-        want: `<p>　　line1</p>
-<p>　　line2</p>`,
+        want: `<p>　　line1</p><p>　　line2</p>`,
+      },
+    ];
+    for (const t of tests) {
+      expect(unescape(marked(t.markdown))).toBe(t.want);
+    }
+  });
+  test("parse tags", () => {
+    const tests = [
+      {
+        markdown: `#123 `,
+        want: `<p><span class='tag-span'>#123</span> </p>`,
+      },
+      {
+        markdown: `#123#asd`,
+        want: `<p><span class='tag-span'>#123</span><span class='tag-span'>#asd</span></p>`,
+      },
+      {
+        markdown: `#123`,
+        want: `<p><span class='tag-span'>#123</span></p>`,
+      },
+      {
+        markdown: `123123#123`,
+        want: `<p>123123<span class='tag-span'>#123</span></p>`,
+      },
+      {
+        markdown: `123123 #123`,
+        want: `<p>123123 <span class='tag-span'>#123</span></p>`,
       },
     ];
     for (const t of tests) {
diff --git a/web/src/labs/marked/parser/Blockquote.ts b/web/src/labs/marked/parser/Blockquote.ts
index 2c796f8c..3e1a47a4 100644
--- a/web/src/labs/marked/parser/Blockquote.ts
+++ b/web/src/labs/marked/parser/Blockquote.ts
@@ -1,18 +1,24 @@
 import { escape } from "lodash";
 
-export const BLOCKQUOTE_REG = /^>\s+(.+)(\n?)/;
+export const BLOCKQUOTE_REG = /^> ([^\n]+)/;
+
+const matcher = (rawStr: string) => {
+  const matchResult = rawStr.match(BLOCKQUOTE_REG);
+  return matchResult;
+};
 
 const renderer = (rawStr: string): string => {
-  const matchResult = rawStr.match(BLOCKQUOTE_REG);
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
 
-  return `<blockquote>${escape(matchResult[1])}</blockquote>${matchResult[2]}`;
+  return `<blockquote>${escape(matchResult[1])}</blockquote>`;
 };
 
 export default {
   name: "blockquote",
   regex: BLOCKQUOTE_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/Bold.ts b/web/src/labs/marked/parser/Bold.ts
index 1a4083a9..578a6ed4 100644
--- a/web/src/labs/marked/parser/Bold.ts
+++ b/web/src/labs/marked/parser/Bold.ts
@@ -3,8 +3,13 @@ import Link from "./Link";
 
 export const BOLD_REG = /\*\*(.+?)\*\*/;
 
-const renderer = (rawStr: string): string => {
+const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(BOLD_REG);
+  return matchResult;
+};
+
+const renderer = (rawStr: string): string => {
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
@@ -16,5 +21,6 @@ const renderer = (rawStr: string): string => {
 export default {
   name: "bold",
   regex: BOLD_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/BoldEmphasis.ts b/web/src/labs/marked/parser/BoldEmphasis.ts
index 6d5e7361..0fdf37eb 100644
--- a/web/src/labs/marked/parser/BoldEmphasis.ts
+++ b/web/src/labs/marked/parser/BoldEmphasis.ts
@@ -3,8 +3,13 @@ import Link from "./Link";
 
 export const BOLD_EMPHASIS_REG = /\*\*\*(.+?)\*\*\*/;
 
-const renderer = (rawStr: string): string => {
+const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(BOLD_EMPHASIS_REG);
+  return matchResult;
+};
+
+const renderer = (rawStr: string): string => {
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
@@ -16,5 +21,6 @@ const renderer = (rawStr: string): string => {
 export default {
   name: "bold emphasis",
   regex: BOLD_EMPHASIS_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/Br.ts b/web/src/labs/marked/parser/Br.ts
new file mode 100644
index 00000000..0882474f
--- /dev/null
+++ b/web/src/labs/marked/parser/Br.ts
@@ -0,0 +1,17 @@
+export const BR_REG = /^(\n+)/;
+
+const matcher = (rawStr: string) => {
+  const matchResult = rawStr.match(BR_REG);
+  return matchResult;
+};
+
+const renderer = (rawStr: string): string => {
+  return rawStr.replaceAll("\n", "<br>");
+};
+
+export default {
+  name: "br",
+  regex: BR_REG,
+  matcher,
+  renderer,
+};
diff --git a/web/src/labs/marked/parser/CodeBlock.ts b/web/src/labs/marked/parser/CodeBlock.ts
index 52e94540..3275bbec 100644
--- a/web/src/labs/marked/parser/CodeBlock.ts
+++ b/web/src/labs/marked/parser/CodeBlock.ts
@@ -1,10 +1,15 @@
 import { escape } from "lodash-es";
 import hljs from "highlight.js";
 
-export const CODE_BLOCK_REG = /^```(\S*?)\s([\s\S]*?)```(\n?)/;
+export const CODE_BLOCK_REG = /^```(\S*?)\s([\s\S]*?)```/;
+
+const matcher = (rawStr: string) => {
+  const matchResult = rawStr.match(CODE_BLOCK_REG);
+  return matchResult;
+};
 
 const renderer = (rawStr: string): string => {
-  const matchResult = rawStr.match(CODE_BLOCK_REG);
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
@@ -21,11 +26,12 @@ const renderer = (rawStr: string): string => {
     // do nth
   }
 
-  return `<pre><code class="language-${language}">${highlightedCode}</code></pre>${matchResult[3]}`;
+  return `<pre><code class="language-${language}">${highlightedCode}</code></pre>`;
 };
 
 export default {
   name: "code block",
   regex: CODE_BLOCK_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/DoneList.ts b/web/src/labs/marked/parser/DoneList.ts
index a1e58a80..5faee636 100644
--- a/web/src/labs/marked/parser/DoneList.ts
+++ b/web/src/labs/marked/parser/DoneList.ts
@@ -1,20 +1,26 @@
 import { inlineElementParserList } from ".";
 import { marked } from "..";
 
-export const DONE_LIST_REG = /^- \[[xX]\] (.+)(\n?)/;
+export const DONE_LIST_REG = /^- \[[xX]\] ([^\n]+)/;
+
+const matcher = (rawStr: string) => {
+  const matchResult = rawStr.match(DONE_LIST_REG);
+  return matchResult;
+};
 
 const renderer = (rawStr: string): string => {
-  const matchResult = rawStr.match(DONE_LIST_REG);
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
 
   const parsedContent = marked(matchResult[1], [], inlineElementParserList);
-  return `<p class='li-container'><span class='todo-block done' data-value='DONE'>✓</span><span>${parsedContent}</span></p>${matchResult[2]}`;
+  return `<p class='li-container'><span class='todo-block done' data-value='DONE'>✓</span><span>${parsedContent}</span></p>`;
 };
 
 export default {
   name: "done list",
   regex: DONE_LIST_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/Emphasis.ts b/web/src/labs/marked/parser/Emphasis.ts
index f51e7c63..e339bf3a 100644
--- a/web/src/labs/marked/parser/Emphasis.ts
+++ b/web/src/labs/marked/parser/Emphasis.ts
@@ -3,8 +3,13 @@ import Link from "./Link";
 
 export const EMPHASIS_REG = /\*(.+?)\*/;
 
-const renderer = (rawStr: string): string => {
+const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(EMPHASIS_REG);
+  return matchResult;
+};
+
+const renderer = (rawStr: string): string => {
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
@@ -16,5 +21,6 @@ const renderer = (rawStr: string): string => {
 export default {
   name: "emphasis",
   regex: EMPHASIS_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/HorizontalRules.ts b/web/src/labs/marked/parser/HorizontalRules.ts
index 2d30003f..a52a519b 100644
--- a/web/src/labs/marked/parser/HorizontalRules.ts
+++ b/web/src/labs/marked/parser/HorizontalRules.ts
@@ -1,15 +1,18 @@
-export const HORIZONTAL_RULES_REG = /^---\n|^\*\*\*\n|^___\n/;
+export const HORIZONTAL_RULES_REG = /^_{3}|^-{3}|^\*{3}/;
 
-export const renderer = (rawStr: string): string => {
+const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(HORIZONTAL_RULES_REG);
-  if (!matchResult) {
-    return rawStr;
-  }
-  return `<hr>\n`;
+  return matchResult;
+};
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export const renderer = (rawStr: string): string => {
+  return `<hr>`;
 };
 
 export default {
   name: "horizontal rules",
   regex: HORIZONTAL_RULES_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/Image.ts b/web/src/labs/marked/parser/Image.ts
index ee9bea04..b3afc50a 100644
--- a/web/src/labs/marked/parser/Image.ts
+++ b/web/src/labs/marked/parser/Image.ts
@@ -3,8 +3,13 @@ import { absolutifyLink } from "../../../helpers/utils";
 
 export const IMAGE_REG = /!\[.*?\]\((.+?)\)/;
 
-const renderer = (rawStr: string): string => {
+const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(IMAGE_REG);
+  return matchResult;
+};
+
+const renderer = (rawStr: string): string => {
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
@@ -16,5 +21,6 @@ const renderer = (rawStr: string): string => {
 export default {
   name: "image",
   regex: IMAGE_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/InlineCode.ts b/web/src/labs/marked/parser/InlineCode.ts
index 4c40fbe8..7de2a1f9 100644
--- a/web/src/labs/marked/parser/InlineCode.ts
+++ b/web/src/labs/marked/parser/InlineCode.ts
@@ -2,8 +2,13 @@ import { escape } from "lodash-es";
 
 export const INLINE_CODE_REG = /`(.+?)`/;
 
-const renderer = (rawStr: string): string => {
+const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(INLINE_CODE_REG);
+  return matchResult;
+};
+
+const renderer = (rawStr: string): string => {
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
@@ -14,5 +19,6 @@ const renderer = (rawStr: string): string => {
 export default {
   name: "inline code",
   regex: INLINE_CODE_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/Link.ts b/web/src/labs/marked/parser/Link.ts
index e25b8142..7b9ac4fc 100644
--- a/web/src/labs/marked/parser/Link.ts
+++ b/web/src/labs/marked/parser/Link.ts
@@ -7,8 +7,13 @@ import BoldEmphasis from "./BoldEmphasis";
 
 export const LINK_REG = /\[(.*?)\]\((.+?)\)+/;
 
-const renderer = (rawStr: string): string => {
+const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(LINK_REG);
+  return matchResult;
+};
+
+const renderer = (rawStr: string): string => {
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
@@ -19,5 +24,6 @@ const renderer = (rawStr: string): string => {
 export default {
   name: "link",
   regex: LINK_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/OrderedList.ts b/web/src/labs/marked/parser/OrderedList.ts
index 020b5b1a..3f7f3fb7 100644
--- a/web/src/labs/marked/parser/OrderedList.ts
+++ b/web/src/labs/marked/parser/OrderedList.ts
@@ -1,20 +1,26 @@
 import { inlineElementParserList } from ".";
 import { marked } from "..";
 
-export const ORDERED_LIST_REG = /^(\d+)\. (.+)(\n?)/;
+export const ORDERED_LIST_REG = /^(\d+)\. (.+)/;
+
+const matcher = (rawStr: string) => {
+  const matchResult = rawStr.match(ORDERED_LIST_REG);
+  return matchResult;
+};
 
 const renderer = (rawStr: string): string => {
-  const matchResult = rawStr.match(ORDERED_LIST_REG);
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
 
   const parsedContent = marked(matchResult[2], [], inlineElementParserList);
-  return `<p class='li-container'><span class='ol-block'>${matchResult[1]}.</span><span>${parsedContent}</span></p>${matchResult[3]}`;
+  return `<p class='li-container'><span class='ol-block'>${matchResult[1]}.</span><span>${parsedContent}</span></p>`;
 };
 
 export default {
   name: "ordered list",
   regex: ORDERED_LIST_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/Paragraph.ts b/web/src/labs/marked/parser/Paragraph.ts
index 3b139c34..bc22d8ca 100644
--- a/web/src/labs/marked/parser/Paragraph.ts
+++ b/web/src/labs/marked/parser/Paragraph.ts
@@ -1,20 +1,21 @@
 import { inlineElementParserList } from ".";
 import { marked } from "..";
 
-export const PARAGRAPH_REG = /^(.*)(\n?)/;
+export const PARAGRAPH_REG = /^([^\n]+)/;
+
+const matcher = (rawStr: string) => {
+  const matchResult = rawStr.match(PARAGRAPH_REG);
+  return matchResult;
+};
 
 const renderer = (rawStr: string): string => {
-  const matchResult = rawStr.match(PARAGRAPH_REG);
-  if (!matchResult) {
-    return rawStr;
-  }
-
-  const parsedContent = marked(matchResult[1], [], inlineElementParserList);
-  return `<p>${parsedContent}</p>${matchResult[2]}`;
+  const parsedContent = marked(rawStr, [], inlineElementParserList);
+  return `<p>${parsedContent}</p>`;
 };
 
 export default {
   name: "paragraph",
   regex: PARAGRAPH_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/PlainLink.ts b/web/src/labs/marked/parser/PlainLink.ts
index 73d8265e..3af201ad 100644
--- a/web/src/labs/marked/parser/PlainLink.ts
+++ b/web/src/labs/marked/parser/PlainLink.ts
@@ -2,8 +2,13 @@ import { escape } from "lodash-es";
 
 export const PLAIN_LINK_REG = /(https?:\/\/[^ ]+)/;
 
-const renderer = (rawStr: string): string => {
+const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(PLAIN_LINK_REG);
+  return matchResult;
+};
+
+const renderer = (rawStr: string): string => {
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
@@ -14,5 +19,6 @@ const renderer = (rawStr: string): string => {
 export default {
   name: "plain link",
   regex: PLAIN_LINK_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/PlainText.ts b/web/src/labs/marked/parser/PlainText.ts
index bb3fba3e..507c979f 100644
--- a/web/src/labs/marked/parser/PlainText.ts
+++ b/web/src/labs/marked/parser/PlainText.ts
@@ -2,8 +2,13 @@ import { escape } from "lodash-es";
 
 export const PLAIN_TEXT_REG = /(.+)/;
 
-const renderer = (rawStr: string): string => {
+const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(PLAIN_TEXT_REG);
+  return matchResult;
+};
+
+const renderer = (rawStr: string): string => {
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
@@ -14,5 +19,6 @@ const renderer = (rawStr: string): string => {
 export default {
   name: "plain text",
   regex: PLAIN_TEXT_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/Strikethrough.ts b/web/src/labs/marked/parser/Strikethrough.ts
index db9b8e55..b58c9222 100644
--- a/web/src/labs/marked/parser/Strikethrough.ts
+++ b/web/src/labs/marked/parser/Strikethrough.ts
@@ -2,8 +2,13 @@ import { marked } from "..";
 
 export const STRIKETHROUGH_REG = /~~(.+?)~~/;
 
-const renderer = (rawStr: string): string => {
+const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(STRIKETHROUGH_REG);
+  return matchResult;
+};
+
+const renderer = (rawStr: string): string => {
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
@@ -15,5 +20,6 @@ const renderer = (rawStr: string): string => {
 export default {
   name: "Strikethrough",
   regex: STRIKETHROUGH_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/Tag.ts b/web/src/labs/marked/parser/Tag.ts
index 8b2cc286..a0fc5fff 100644
--- a/web/src/labs/marked/parser/Tag.ts
+++ b/web/src/labs/marked/parser/Tag.ts
@@ -2,17 +2,26 @@ import { escape } from "lodash-es";
 
 export const TAG_REG = /#([^\s#]+)/;
 
-const renderer = (rawStr: string): string => {
+export const matcher = (rawStr: string) => {
   const matchResult = rawStr.match(TAG_REG);
+  if (matchResult) {
+    return matchResult;
+  }
+  return null;
+};
+
+const renderer = (rawStr: string): string => {
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
 
-  return `<span class='tag-span'>#${escape(matchResult[1])}</span> `;
+  return `<span class='tag-span'>#${escape(matchResult[1])}</span>`;
 };
 
 export default {
   name: "tag",
   regex: TAG_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/TodoList.ts b/web/src/labs/marked/parser/TodoList.ts
index c8a3497d..4d552ff3 100644
--- a/web/src/labs/marked/parser/TodoList.ts
+++ b/web/src/labs/marked/parser/TodoList.ts
@@ -1,23 +1,26 @@
-import { escape } from "lodash-es";
 import { inlineElementParserList } from ".";
 import { marked } from "..";
 
-export const TODO_LIST_REG = /^- \[ \] (.+)(\n?)/;
+export const TODO_LIST_REG = /^- \[ \] ([^\n]+)/;
+
+const matcher = (rawStr: string) => {
+  const matchResult = rawStr.match(TODO_LIST_REG);
+  return matchResult;
+};
 
 const renderer = (rawStr: string): string => {
-  const matchResult = rawStr.match(TODO_LIST_REG);
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
 
   const parsedContent = marked(matchResult[1], [], inlineElementParserList);
-  return `<p class='li-container'><span class='todo-block todo' data-value='TODO'></span><span>${parsedContent}</span></p>${escape(
-    matchResult[2]
-  )}`;
+  return `<p class='li-container'><span class='todo-block todo' data-value='TODO'></span><span>${parsedContent}</span></p>`;
 };
 
 export default {
   name: "todo list",
   regex: TODO_LIST_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/UnorderedList.ts b/web/src/labs/marked/parser/UnorderedList.ts
index 736d490d..29039828 100644
--- a/web/src/labs/marked/parser/UnorderedList.ts
+++ b/web/src/labs/marked/parser/UnorderedList.ts
@@ -1,21 +1,26 @@
-import { escape } from "lodash-es";
 import { inlineElementParserList } from ".";
 import { marked } from "..";
 
-export const UNORDERED_LIST_REG = /^[*-] (.+)(\n?)/;
+export const UNORDERED_LIST_REG = /^[*-] ([^\n]+)/;
+
+const matcher = (rawStr: string) => {
+  const matchResult = rawStr.match(UNORDERED_LIST_REG);
+  return matchResult;
+};
 
 const renderer = (rawStr: string): string => {
-  const matchResult = rawStr.match(UNORDERED_LIST_REG);
+  const matchResult = matcher(rawStr);
   if (!matchResult) {
     return rawStr;
   }
 
   const parsedContent = marked(matchResult[1], [], inlineElementParserList);
-  return `<p class='li-container'><span class='ul-block'>•</span><span>${parsedContent}</span></p>${escape(matchResult[2])}`;
+  return `<p class='li-container'><span class='ul-block'>•</span><span>${parsedContent}</span></p>`;
 };
 
 export default {
   name: "unordered list",
   regex: UNORDERED_LIST_REG,
+  matcher,
   renderer,
 };
diff --git a/web/src/labs/marked/parser/index.ts b/web/src/labs/marked/parser/index.ts
index fcf28d82..fbe8b4b2 100644
--- a/web/src/labs/marked/parser/index.ts
+++ b/web/src/labs/marked/parser/index.ts
@@ -4,6 +4,7 @@ import DoneList from "./DoneList";
 import OrderedList from "./OrderedList";
 import UnorderedList from "./UnorderedList";
 import Paragraph from "./Paragraph";
+import Br from "./Br";
 import Tag from "./Tag";
 import Image from "./Image";
 import Link from "./Link";
@@ -17,15 +18,20 @@ import Blockquote from "./Blockquote";
 import HorizontalRules from "./HorizontalRules";
 import Strikethrough from "./Strikethrough";
 
-export { CODE_BLOCK_REG } from "./CodeBlock";
-export { TODO_LIST_REG } from "./TodoList";
-export { DONE_LIST_REG } from "./DoneList";
 export { TAG_REG } from "./Tag";
-export { IMAGE_REG } from "./Image";
 export { LINK_REG } from "./Link";
-export { HORIZONTAL_RULES_REG } from "./HorizontalRules";
 
 // The order determines the order of execution.
-export const blockElementParserList = [HorizontalRules, CodeBlock, Blockquote, TodoList, DoneList, OrderedList, UnorderedList, Paragraph];
+export const blockElementParserList = [
+  Br,
+  CodeBlock,
+  Blockquote,
+  TodoList,
+  DoneList,
+  OrderedList,
+  UnorderedList,
+  HorizontalRules,
+  Paragraph,
+];
+
 export const inlineElementParserList = [Image, BoldEmphasis, Bold, Emphasis, Link, InlineCode, PlainLink, Strikethrough, Tag, PlainText];
-export const parserList = [...blockElementParserList, ...inlineElementParserList];