diff --git a/src/containers/App.tsx b/src/containers/App.tsx
index 212535c..c08e074 100644
--- a/src/containers/App.tsx
+++ b/src/containers/App.tsx
@@ -12,12 +12,16 @@ import Logs from '@containers/Logs'
 import Rules from '@containers/Rules'
 import Settings from '@containers/Settings'
 import SlideBar from '@containers/Sidebar'
+import { getLogsStreamReader } from '@lib/request'
 
 export interface AppProps extends I18nProps {
 }
 
 @hot(module)
 export default class App extends React.Component<AppProps, {}> {
+    componentDidMount () {
+        getLogsStreamReader()
+    }
     render () {
         const routes = [
             { path: '/', name: 'Overview', component: Overview, exact: true },
diff --git a/src/containers/Logs/index.tsx b/src/containers/Logs/index.tsx
index d856721..66ebe9a 100644
--- a/src/containers/Logs/index.tsx
+++ b/src/containers/Logs/index.tsx
@@ -4,8 +4,7 @@ import { translate } from 'react-i18next'
 import { I18nProps } from '@models'
 import { Card, Header } from '@components'
 import './style.scss'
-import { StreamReader } from '@lib/streamer'
-import { getExternalControllerConfig, getConfig } from '@lib/request'
+import { getLogsStreamReader } from '@lib/request'
 
 interface Log {
     type: string
@@ -27,11 +26,9 @@ class Logs extends React.Component<LogsProps, LogsState> {
     private streamReader = null
     private listRef = React.createRef<HTMLUListElement>()
     async componentDidMount () {
-        const externalController = await getExternalControllerConfig()
-        const { data: config } = await getConfig()
-        const logUrl = `http://${externalController.hostname}:${externalController.port}/logs?level=${config['log-level']}`
-        this.streamReader = new StreamReader({ url: logUrl })
-        let logs = []
+        this.streamReader = await getLogsStreamReader()
+        let logs = this.streamReader.buffer()
+        this.setState({ logs }, () => this.scrollToBottom())
         this.streamReader.subscribe('data', (data) => {
             logs = [].concat(this.state.logs, data.map(d => ({ ...d, time: new Date() })))
             this.setState({ logs }, () => this.scrollToBottom())
diff --git a/src/lib/request.ts b/src/lib/request.ts
index ade8c00..89706d7 100644
--- a/src/lib/request.ts
+++ b/src/lib/request.ts
@@ -2,8 +2,10 @@ import axios, { AxiosInstance } from 'axios'
 import { Partial, getLocalStorageItem } from '@lib/helper'
 import { isClashX } from '@lib/jsBridge'
 import { rootStores } from '@lib/createStore'
+import { StreamReader } from './streamer'
 
 let instance: AxiosInstance
+let logsStreamReader = null
 
 export interface Config {
     port: number
@@ -116,3 +118,14 @@ export async function getExternalControllerConfig () {
 
     return { hostname, port, secret }
 }
+
+export async function getLogsStreamReader () {
+    if (logsStreamReader) {
+        return logsStreamReader
+    }
+    const externalController = await getExternalControllerConfig()
+    const { data: config } = await getConfig()
+    const logUrl = `http://${externalController.hostname}:${externalController.port}/logs?level=${config['log-level']}`
+    logsStreamReader = new StreamReader({ url: logUrl, bufferLength: 200 })
+    return logsStreamReader
+}
diff --git a/src/stores/ConfigStore.ts b/src/stores/ConfigStore.ts
index 5cc7e7b..f8e4624 100644
--- a/src/stores/ConfigStore.ts
+++ b/src/stores/ConfigStore.ts
@@ -29,7 +29,6 @@ export class ConfigStore {
 
             // otherwise parse ini
             const config = yaml.parse(rawConfig)
-            console.log(config)
             const externalController = config['external-controller'] as string || ''
             const host = externalController.split(':')