diff --git a/src/components/SideBar.tsx b/src/components/SideBar.tsx
index 9aa21ca..89cb0c8 100644
--- a/src/components/SideBar.tsx
+++ b/src/components/SideBar.tsx
@@ -30,17 +30,7 @@ const RawGitako: React.FC<Props & ConnectorState> = function RawGitako(props) {
   const accessToken = props.configContext.val.accessToken
   const [baseSize] = React.useState(() => configContext.val.sideBarWidth)
 
-  const { shrinkGitHubHeader } = configContext.val
-  React.useEffect(() => {
-    if (platform === GitHub) {
-      const ele = document.body
-      if (shrinkGitHubHeader) {
-        ele.classList.add('shrink-github-header')
-      } else {
-        ele.classList.remove('shrink-github-header')
-      }
-    }
-  }, [shrinkGitHubHeader])
+  useShrinkGitHubHeader(configContext.val.shrinkGitHubHeader)
 
   const intelligentToggle = configContext.val.intelligentToggle
   React.useEffect(() => {
@@ -168,6 +158,19 @@ RawGitako.defaultProps = {
 
 export const SideBar = connect(SideBarCore)(RawGitako)
 
+function useShrinkGitHubHeader(shrinkGitHubHeader: boolean) {
+  React.useEffect(() => {
+    if (platform === GitHub) {
+      const target = document.body
+      if (shrinkGitHubHeader) {
+        target.classList.add('shrink-github-header')
+      } else {
+        target.classList.remove('shrink-github-header')
+      }
+    }
+  }, [shrinkGitHubHeader])
+}
+
 function AccessDeniedError({ hasToken }: { hasToken: boolean }) {
   return <AccessDeniedDescription hasToken={hasToken} />
 }
diff --git a/src/content.tsx b/src/content.tsx
index 32da934..91c1db0 100644
--- a/src/content.tsx
+++ b/src/content.tsx
@@ -9,13 +9,6 @@ import './content.scss'
 if (platform.resolveMeta()) {
   addMiddleware(withErrorLog)
 
-  async function init() {
-    await injectStyles(browser.extension.getURL('content.css'))
-    const SideBarElement = document.createElement('div')
-    document.body.appendChild(SideBarElement)
-    ReactDOM.render(<Gitako />, SideBarElement)
-  }
-
   if (document.readyState === 'loading') {
     document.addEventListener('DOMContentLoaded', init)
   } else {
@@ -23,6 +16,13 @@ if (platform.resolveMeta()) {
   }
 }
 
+async function init() {
+  await injectStyles(browser.extension.getURL('content.css'))
+  const SideBarElement = document.createElement('div')
+  document.body.appendChild(SideBarElement)
+  ReactDOM.render(<Gitako />, SideBarElement)
+}
+
 // injects a copy of stylesheets so that other extensions(e.g. dark reader) could read
 // resolves when style is loaded to prevent render without proper styles
 async function injectStyles(url: string) {
diff --git a/src/driver/core/FileExplorer.ts b/src/driver/core/FileExplorer.ts
index a28f651..2b2b78c 100644
--- a/src/driver/core/FileExplorer.ts
+++ b/src/driver/core/FileExplorer.ts
@@ -51,11 +51,9 @@ export const setUpTree: BoundMethodCreator<
   if (!treeRoot) return
   dispatch.set({ state: 'rendering' })
 
-  const { compressSingletonFolder } = config
-
   visibleNodesGenerator = new VisibleNodesGenerator({
     root: treeRoot,
-    compress: compressSingletonFolder,
+    compress: config.compressSingletonFolder,
     async getTreeData(path) {
       const { root } = await platform.getTreeData(metaData, path, false, config.accessToken)
       return root
diff --git a/src/platforms/GitHub/URLHelper.ts b/src/platforms/GitHub/URLHelper.ts
index fcdc3d5..f8093cd 100644
--- a/src/platforms/GitHub/URLHelper.ts
+++ b/src/platforms/GitHub/URLHelper.ts
@@ -1,6 +1,6 @@
 import { raiseError } from 'analytics'
 
-export function parse(): Partial<MetaData> & { path: string[] } {
+export function parse(): Pick<MetaData, 'userName' | 'repoName' | 'type'> & { path: string[] } {
   const { pathname } = window.location
   let [
     ,
@@ -13,12 +13,13 @@ export function parse(): Partial<MetaData> & { path: string[] } {
   return {
     userName,
     repoName,
-    branchName: undefined,
     type,
     path,
   }
 }
 
+// not working well with non-branch blob
+// cannot handle '/' split branch name, should not use when possibly in branch page
 export function parseSHA() {
   const { type, path } = parse()
   return type === 'blob' || type === 'tree' ? path[0] : undefined
diff --git a/src/platforms/GitHub/index.ts b/src/platforms/GitHub/index.ts
index ad1a6e7..d17ade2 100644
--- a/src/platforms/GitHub/index.ts
+++ b/src/platforms/GitHub/index.ts
@@ -91,26 +91,23 @@ export const GitHub: Platform = {
       return null
     }
 
-    let detectedBranchName
+    let branchName
     if (URLHelper.isInPullPage()) {
-      detectedBranchName = DOMHelper.getIssueTitle()
+      branchName = DOMHelper.getIssueTitle()
     } else if (
       DOMHelper.isInCodePage() &&
       !['releases', 'tags'].includes(URLHelper.parse().type || '') // resolve sentry issue #-CK
     ) {
-      // not working well with non-branch blob
-      // cannot handle '/' split branch name, should not use when possibly on branch page
-      detectedBranchName = DOMHelper.getCurrentBranch() || URLHelper.parseSHA()
+      branchName = DOMHelper.getCurrentBranch() || URLHelper.parseSHA()
     }
 
     const metaData = {
       ...URLHelper.parse(),
-      branchName: detectedBranchName,
+      branchName,
     } as MetaData
     return metaData
   },
-  async getMetaData(partialMetaData, accessToken) {
-    const { userName, repoName } = partialMetaData
+  async getMetaData({ userName, repoName }, accessToken) {
     const data = await API.getRepoMeta(userName, repoName, accessToken)
     return {
       userUrl: data?.owner?.html_url,
@@ -156,9 +153,9 @@ export const GitHub: Platform = {
         path: item.filename || '',
         type: 'blob',
         name: item.filename?.replace(/^.*\//, '') || '',
-        url: `https://${window.location.host}/${metaData.userName}/${
-          metaData.repoName
-        }/pull/${pullId}/files${window.location.search}#${creator(item.filename) || ''}`,
+        url: `https://${window.location.host}/${userName}/${repoName}/pull/${pullId}/files${
+          window.location.search
+        }#${creator(item.filename) || ''}`,
         sha: item.sha,
       }))
 
@@ -198,13 +195,7 @@ export const GitHub: Platform = {
         name: item.path?.replace(/^.*\//, '') || '',
         url:
           item.url && item.type && item.path
-            ? getUrlForRedirect(
-                metaData.userName,
-                metaData.repoName,
-                metaData.branchName,
-                item.type,
-                item.path,
-              )
+            ? getUrlForRedirect(userName, repoName, branchName, item.type, item.path)
             : undefined,
         contents: item.type === 'tree' ? [] : undefined,
         sha: item.sha,
@@ -213,13 +204,8 @@ export const GitHub: Platform = {
 
     const gitModules = root.contents?.find(item => item.name === '.gitmodules')
     if (gitModules) {
-      if (metaData.userName && metaData.repoName && gitModules.sha) {
-        const blobData = await API.getBlobData(
-          metaData.userName,
-          metaData.repoName,
-          gitModules.sha,
-          accessToken,
-        )
+      if (userName && repoName && gitModules.sha) {
+        const blobData = await API.getBlobData(userName, repoName, gitModules.sha, accessToken)
 
         if (blobData && blobData.encoding === 'base64' && blobData.content) {
           await resolveGitModules(root, Base64.decode(blobData.content))
diff --git a/src/utils/configHelper.ts b/src/utils/configHelper.ts
index c6cb4b0..4c73b14 100644
--- a/src/utils/configHelper.ts
+++ b/src/utils/configHelper.ts
@@ -33,7 +33,7 @@ export enum configKeys {
 const defaultConfigs: Config = {
   sideBarWidth: 260,
   shortcut: undefined,
-  accessToken: undefined,
+  accessToken: '',
   compressSingletonFolder: true,
   copyFileButton: true,
   copySnippetButton: true,