diff --git a/src/components/Discover/Conformance/StatusBar.vue b/src/components/Discover/StatusBar.vue
similarity index 100%
rename from src/components/Discover/Conformance/StatusBar.vue
rename to src/components/Discover/StatusBar.vue
diff --git a/src/stores/performance.js b/src/stores/performance.js
new file mode 100644
index 0000000..ab4adfa
--- /dev/null
+++ b/src/stores/performance.js
@@ -0,0 +1,39 @@
+import { defineStore } from "pinia";
+// import moment from "moment";
+// import { Decimal } from 'decimal.js';
+// import abbreviateNumber from '@/module/abbreviateNumber.js';
+import apiError from '@/module/apiError.js';
+
+export default defineStore('performanceStore', {
+  state: () => ({
+    allPerformanceData: null,
+  }),
+  getters: {
+    performanceData: state => {
+      return state.allPerformanceData;
+    },
+  },
+  actions: {
+    /**
+     * Get Performance
+     */
+    async getPerformance(type, id) {
+      let api = '';
+
+      switch (type) {
+        case 'log':
+          api = `/api/logs/${id}/performance`;
+          break;
+        case 'filter':
+          api = `/api/filters/${id}/performance`;
+          break;
+      }
+      try {
+        const response = await this.$axios.get(api);
+        this.allPerformanceData = response.data;
+      } catch(error) {
+        apiError(error, 'Failed to load the Performance.');
+      }
+    }
+  },
+})
diff --git a/src/views/Discover/Conformance/index.vue b/src/views/Discover/Conformance/index.vue
index f509b37..e936beb 100644
--- a/src/views/Discover/Conformance/index.vue
+++ b/src/views/Discover/Conformance/index.vue
@@ -12,7 +12,7 @@ import { storeToRefs } from 'pinia';
 import FilesStore from '@/stores/files.js';
 import LoadingStore from '@/stores/loading.js';
 import ConformanceStore from '@/stores/conformance.js';
-import StatusBar from '@/components/Discover/Conformance/StatusBar.vue';
+import StatusBar from '@/components/Discover/StatusBar.vue';
 import ConformanceResults from '@/components/Discover/Conformance/ConformanceResults.vue';
 import ConformanceSidebar from '@/components/Discover/Conformance/ConformanceSidebar.vue';
 
diff --git a/src/views/Discover/Performance/index.vue b/src/views/Discover/Performance/index.vue
index 02db647..5d15d02 100644
--- a/src/views/Discover/Performance/index.vue
+++ b/src/views/Discover/Performance/index.vue
@@ -1,5 +1,39 @@
 <template>
-  <div>
-    <h2>ProformanceIndex</h2>
-  </div>
+  <main class="h-screen-main relative">
+    <div class="h-full relative bg-neutral-50">
+      performance: {{ this.performanceData }}
+    </div>
+
+    <StatusBar></StatusBar>
+  </main>
 </template>
+<script>
+import { storeToRefs } from 'pinia';
+import LoadingStore from '@/stores/loading.js';
+import PerformanceStore from '@/stores/performance.js';
+import StatusBar from '@/components/Discover/StatusBar.vue';
+
+export default {
+  setup() {
+    const loadingStore = LoadingStore();
+    const performanceStore = PerformanceStore();
+    const { isLoading } = storeToRefs(loadingStore);
+    const { performanceData } = storeToRefs(performanceStore);
+
+    return { isLoading, performanceStore, performanceData }
+  },
+  components: {
+    StatusBar,
+  },
+  async created() {
+    this.isLoading = true;
+    const routeParams = this.$route.params;
+    let id = routeParams.fileId;
+    let type = routeParams.type;
+
+    // 取得 Performance Data
+    await this.performanceStore.getPerformance(type, id);
+    this.isLoading = false;
+  }
+}
+</script>