diff --git a/src/components/Authenticate/AuthenticateMainView.vue b/src/components/Authenticate/AuthenticateMainView.vue
index ea6639d17..bb5bfdfcf 100644
--- a/src/components/Authenticate/AuthenticateMainView.vue
+++ b/src/components/Authenticate/AuthenticateMainView.vue
@@ -1,9 +1,12 @@
 <template>
   <transition name="zoom" appear>
     <!-- https://github.com/vuejs/rfcs/blob/master/active-rfcs/0017-transition-as-root.md -->
-    <div v-if="show && (type !== 'login' || version)" :class="$style.container">
+    <div
+      v-if="show && (type !== 'login' || externalLogin)"
+      :class="$style.container"
+    >
       <authenticate-modal>
-        <login-form v-if="type === 'login'" :version="version" />
+        <login-form v-if="type === 'login'" :external-login="externalLogin" />
         <registration-form v-if="type === 'registration'" />
         <consent-form v-if="type === 'consent'" />
       </authenticate-modal>
@@ -41,8 +44,8 @@ export default defineComponent({
   setup(props) {
     const isLogin = computed(() => props.type === 'login')
     // ログイン画面が表示されるときにlayout shiftが起こらないように取得後に表示する
-    const version = useVersion(isLogin)
-    return { version }
+    const { externalLogin } = useVersion(isLogin)
+    return { externalLogin }
   }
 })
 </script>
diff --git a/src/components/Authenticate/LoginForm.vue b/src/components/Authenticate/LoginForm.vue
index 53d460144..ec5985d26 100644
--- a/src/components/Authenticate/LoginForm.vue
+++ b/src/components/Authenticate/LoginForm.vue
@@ -37,7 +37,7 @@
         <authenticate-button
           type="secondary"
           :class="$style.exLoginButton"
-          v-show="externalLogin.includes('traQ')"
+          v-show="externalLogin.has('traQ')"
           label="traP"
           icon-name="traQ"
           @click="loginExternal('traq')"
@@ -45,7 +45,7 @@
         <authenticate-button
           type="secondary"
           :class="$style.exLoginButton"
-          v-show="externalLogin.includes('google')"
+          v-show="externalLogin.has('google')"
           label="Google"
           icon-mdi
           icon-name="google"
@@ -54,7 +54,7 @@
         <authenticate-button
           type="secondary"
           :class="$style.exLoginButton"
-          v-show="externalLogin.includes('github')"
+          v-show="externalLogin.has('github')"
           label="GitHub"
           icon-mdi
           icon-name="github"
@@ -63,7 +63,7 @@
         <authenticate-button
           type="secondary"
           :class="$style.exLoginButton"
-          v-show="externalLogin.includes('oidc')"
+          v-show="externalLogin.has('oidc')"
           label="OpenID Connect"
           icon-mdi
           icon-name="openid"
@@ -75,7 +75,7 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, PropType } from 'vue'
+import { defineComponent, PropType } from 'vue'
 import useLogin from './use/login'
 import { isIOSApp } from '@/lib/util/browser'
 import AuthenticateInput from './AuthenticateInput.vue'
@@ -83,7 +83,6 @@ import AuthenticateHeader from './AuthenticateHeader.vue'
 import AuthenticateButton from './AuthenticateButton.vue'
 import AuthenticateSeparator from './AuthenticateSeparator.vue'
 import config from '@/config'
-import { Version } from '@traptitech/traq'
 
 export default defineComponent({
   name: 'LoginForm',
@@ -94,8 +93,8 @@ export default defineComponent({
     AuthenticateSeparator
   },
   props: {
-    version: {
-      type: Object as PropType<Version>,
+    externalLogin: {
+      type: Set as PropType<Set<string>>,
       required: true
     }
   },
@@ -103,17 +102,13 @@ export default defineComponent({
     const { loginState, login, loginExternal } = useLogin()
     const isIOS = isIOSApp()
     const { resetLink } = config.auth
-    const externalLogin = computed(
-      () => props.version.flags.externalLogin ?? []
-    )
 
     return {
       resetLink,
       loginState,
       login,
       loginExternal,
-      isIOS,
-      externalLogin
+      isIOS
     }
   }
 })
diff --git a/src/components/Main/MainView/ChannelSidebar/ChannelSidebarMember.vue b/src/components/Main/MainView/ChannelSidebar/ChannelSidebarMember.vue
index 1237054c3..1fc8e50c4 100644
--- a/src/components/Main/MainView/ChannelSidebar/ChannelSidebarMember.vue
+++ b/src/components/Main/MainView/ChannelSidebar/ChannelSidebarMember.vue
@@ -39,7 +39,7 @@ export default defineComponent({
       () => store.state.entities.channelsMap.get(props.channelId)?.force
     )
     const viewStates = computed(() =>
-      [...(subscribers.value ?? [])]
+      [...(subscribers.value ?? new Set())]
         .map(id => ({
           user: store.getters.entities.activeUsersMap.get(id),
           active: props.viewerIds.includes(id)
diff --git a/src/components/Main/MainView/MessageElement/MessageStampList.vue b/src/components/Main/MainView/MessageElement/MessageStampList.vue
index 4c8dcdcff..b9d3db8ad 100644
--- a/src/components/Main/MainView/MessageElement/MessageStampList.vue
+++ b/src/components/Main/MainView/MessageElement/MessageStampList.vue
@@ -75,13 +75,13 @@ const createStampList = (
   props: { stamps: MessageStamp[] },
   myId: Ref<UserId | undefined>
 ) => {
-  const map: Record<StampId, MessageStampById> = {}
+  const map = new Map<StampId, MessageStampById>()
   props.stamps.forEach(stamp => {
     const { stampId } = stamp
     if (!store.state.entities.stampsMap.has(stampId)) return
 
-    if (!map[stamp.stampId]) {
-      map[stampId] = {
+    if (!map.has(stamp.stampId)) {
+      map.set(stampId, {
         id: stamp.stampId,
         sum: stamp.count,
         myCount: stamp.userId === myId.value ? stamp.count : 0,
@@ -94,31 +94,33 @@ const createStampList = (
         ],
         createdAt: new Date(stamp.createdAt),
         updatedAt: new Date(stamp.updatedAt)
-      }
+      })
     } else {
-      map[stampId].sum += stamp.count
-      map[stampId].users.push({
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      const s = map.get(stampId)!
+      s.sum += stamp.count
+      s.users.push({
         id: stamp.userId,
         count: stamp.count,
         createdAt: new Date(stamp.createdAt)
       })
       if (stamp.userId === myId.value) {
-        map[stampId].myCount = stamp.count
+        s.myCount = stamp.count
       }
       const createdAt = new Date(stamp.createdAt)
-      if (createdAt < map[stampId].createdAt) {
-        map[stampId].createdAt = createdAt
+      if (createdAt < s.createdAt) {
+        s.createdAt = createdAt
       }
       const updatedAt = new Date(stamp.updatedAt)
-      if (map[stampId].updatedAt < updatedAt) {
-        map[stampId].updatedAt = updatedAt
+      if (s.updatedAt < updatedAt) {
+        s.updatedAt = updatedAt
       }
     }
   })
-  Object.values(map).forEach(stamp =>
+  map.forEach(stamp =>
     stamp.users.sort((a, b) => a.createdAt.getTime() - b.createdAt.getTime())
   )
-  return Object.values(map).sort(
+  return [...map.values()].sort(
     (a, b) => a.createdAt.getTime() - b.createdAt.getTime()
   )
 }
diff --git a/src/components/Main/Navigation/ChannelList/ChannelList.vue b/src/components/Main/Navigation/ChannelList/ChannelList.vue
index e126b5104..9b7c3ff03 100644
--- a/src/components/Main/Navigation/ChannelList/ChannelList.vue
+++ b/src/components/Main/Navigation/ChannelList/ChannelList.vue
@@ -5,7 +5,7 @@
       :key="channel.id"
       :class="$style.element"
       :channel="channel"
-      :is-opened="channelFoldingState[channel.id]"
+      :is-opened="foldedChannels.has(channel.id)"
       :ignore-children="ignoreChildren"
       :show-shortened-path="showShortenedPath"
       :show-topic="showTopic"
@@ -16,13 +16,7 @@
 </template>
 
 <script lang="ts">
-import {
-  defineComponent,
-  reactive,
-  toRefs,
-  PropType,
-  defineAsyncComponent
-} from 'vue'
+import { defineComponent, PropType, defineAsyncComponent, ref } from 'vue'
 import { ChannelId } from '@/types/entity-ids'
 import { ChannelTreeNode } from '@/lib/channelTree'
 import useChannelSelect from '@/use/channelSelect'
@@ -30,18 +24,16 @@ import { Channel } from '@traptitech/traq'
 import SlideDown from '@/components/UI/SlideDown.vue'
 
 const useChannelFolding = () => {
-  const state = reactive({
-    channelFoldingState: {} as Record<ChannelId, boolean>
-  })
+  const foldedChannels = ref(new Set<ChannelId>())
   const onChannelFoldingToggle = (id: ChannelId) => {
-    if (state.channelFoldingState[id]) {
-      state.channelFoldingState[id] = false
+    if (foldedChannels.value.has(id)) {
+      foldedChannels.value.delete(id)
     } else {
-      state.channelFoldingState[id] = true
+      foldedChannels.value.add(id)
     }
   }
   return {
-    ...toRefs(state),
+    foldedChannels,
     onChannelFoldingToggle
   }
 }
@@ -82,9 +74,9 @@ export default defineComponent({
   },
   setup() {
     const { onChannelSelect } = useChannelSelect()
-    const { channelFoldingState, onChannelFoldingToggle } = useChannelFolding()
+    const { foldedChannels, onChannelFoldingToggle } = useChannelFolding()
     return {
-      channelFoldingState,
+      foldedChannels,
       onChannelSelect,
       onChannelFoldingToggle
     }
diff --git a/src/components/Modal/ClipCreateModal/ClipCreateModal.vue b/src/components/Modal/ClipCreateModal/ClipCreateModal.vue
index cca29f032..33fed1de9 100644
--- a/src/components/Modal/ClipCreateModal/ClipCreateModal.vue
+++ b/src/components/Modal/ClipCreateModal/ClipCreateModal.vue
@@ -9,14 +9,14 @@
       v-for="clipFolder in clipFolders"
       :key="clipFolder.id"
       :folder-name="clipFolder.name"
-      :is-selected="selectedState[clipFolder.id]"
+      :is-selected="isSelected.has(clipFolder.id)"
       @click="toggleClip(clipFolder.id)"
     />
   </modal-frame>
 </template>
 
 <script lang="ts">
-import { defineComponent, computed, reactive } from 'vue'
+import { defineComponent, computed, ref, Ref } from 'vue'
 import store from '@/store'
 import apis from '@/lib/apis'
 import { compareString } from '@/lib/util/string'
@@ -27,7 +27,7 @@ import useToastStore from '@/use/toastStore'
 
 const useCreateClip = (
   props: { messageId: MessageId },
-  selectedState: Record<ClipFolderId, boolean>
+  isSelected: Ref<Set<ClipFolderId>>
 ) => {
   const { addSuccessToast, addErrorToast } = useToastStore()
 
@@ -36,11 +36,11 @@ const useCreateClip = (
       await apis.clipMessage(clipFolderId, {
         messageId: props.messageId
       })
-      selectedState[clipFolderId] = true
+      isSelected.value.add(clipFolderId)
       addSuccessToast('クリップフォルダに追加しました')
     } catch (e) {
       if (e.response.status === 409) {
-        selectedState[clipFolderId] = true
+        isSelected.value.add(clipFolderId)
         addErrorToast('すでに追加されています')
         return
       } else {
@@ -51,11 +51,11 @@ const useCreateClip = (
   }
   const deleteClip = async (clipFolderId: ClipFolderId) => {
     await apis.unclipMessage(clipFolderId, props.messageId)
-    selectedState[clipFolderId] = false
+    isSelected.value.delete(clipFolderId)
     addSuccessToast('クリップフォルダから削除しました')
   }
   const toggleClip = async (clipFolderId: ClipFolderId) => {
-    if (selectedState[clipFolderId]) {
+    if (isSelected.value.has(clipFolderId)) {
       await deleteClip(clipFolderId)
     } else {
       await createClip(clipFolderId)
@@ -85,17 +85,15 @@ export default defineComponent({
       folders.sort((a, b) => compareString(a.name, b.name))
       return folders
     })
-    const selectedState = reactive(
-      Object.fromEntries(
-        clipFolders.value.map(folder => [folder.id, false])
-      ) as Record<ClipFolderId, boolean>
-    )
+
+    const isSelected = ref(new Set<ClipFolderId>())
     apis.getMessageClips(props.messageId).then(res => {
-      res.data.forEach(mc => (selectedState[mc.folderId] = true))
+      isSelected.value = new Set(res.data.map(c => c.folderId))
     })
+
     const messageContent = computed(() => message.value?.content ?? '')
-    const { toggleClip } = useCreateClip(props, selectedState)
-    return { messageContent, clipFolders, selectedState, toggleClip }
+    const { toggleClip } = useCreateClip(props, isSelected)
+    return { messageContent, clipFolders, isSelected, toggleClip }
   }
 })
 </script>
diff --git a/src/lib/audioStreamMixer.ts b/src/lib/audioStreamMixer.ts
index 0d952d883..981f4d16d 100644
--- a/src/lib/audioStreamMixer.ts
+++ b/src/lib/audioStreamMixer.ts
@@ -19,10 +19,10 @@ type WebkitWindow = Window &
   }
 
 export default class AudioStreamMixer {
-  private streamSourceNodeMap: Record<string, MediaStreamAudioSourceNode> = {}
-  private audioBufferMap: Record<string, AudioBuffer> = {}
-  private analyserNodeMap: Record<string, AnalyserNode> = {}
-  private gainNodeMap: Record<string, GainNode> = {}
+  private streamSourceNodeMap = new Map<string, MediaStreamAudioSourceNode>()
+  private audioBufferMap = new Map<string, AudioBuffer>()
+  private analyserNodeMap = new Map<string, AnalyserNode>()
+  private gainNodeMap = new Map<string, GainNode>()
   private context: AudioContext
   private masterVolume = 1
   private fileVolume = 0.25
@@ -30,7 +30,7 @@ export default class AudioStreamMixer {
    * それぞれのstreamのボリューム
    * ミュート時はミュートされる前の値を保持
    */
-  private volumeMap: Record<string, number> = {}
+  private volumeMap = new Map<string, number>()
   readonly analyserFftSize = 128
   private readonly frequencyUint8Array = new Uint8Array(
     this.analyserFftSize / 2
@@ -108,9 +108,9 @@ export default class AudioStreamMixer {
     audio.srcObject = mediaStream
     audio.volume = 0
 
-    this.streamSourceNodeMap[key] = source
-    this.analyserNodeMap[key] = analyser
-    this.gainNodeMap[key] = gain
+    this.streamSourceNodeMap.set(key, source)
+    this.analyserNodeMap.set(key, analyser)
+    this.gainNodeMap.set(key, gain)
   }
 
   public async addFileSource(key: string, url: string) {
@@ -118,17 +118,21 @@ export default class AudioStreamMixer {
     const buffer = await response.arrayBuffer()
     const prefixedKey = fileSourcePrefix + key
 
-    this.audioBufferMap[prefixedKey] = await this.context.decodeAudioData(
-      buffer
+    this.audioBufferMap.set(
+      prefixedKey,
+      await this.context.decodeAudioData(buffer)
     )
   }
 
   public async playFileSource(key: string) {
     const suspended = this.context.state === 'suspended'
     const prefixedKey = fileSourcePrefix + key
-    const source = this.createAudioSourceNodeGraph(
-      this.audioBufferMap[prefixedKey]
-    )
+    const buffer = this.audioBufferMap.get(prefixedKey)
+    if (!buffer) {
+      throw new Error(`Unloaded buffer: key name of ${prefixedKey}}`)
+    }
+
+    const source = this.createAudioSourceNodeGraph(buffer)
     if (suspended) {
       await this.context.resume()
       source.addEventListener(
@@ -143,7 +147,7 @@ export default class AudioStreamMixer {
   }
 
   public async removeStream(key: string) {
-    if (!this.streamSourceNodeMap[key]) {
+    if (!this.streamSourceNodeMap.has(key)) {
       // eslint-disable-next-line no-console
       console.warn(
         'audioStreamMixer::removeStream: 同じstreamを重複して取り除こうとした可能性があります'
@@ -152,34 +156,38 @@ export default class AudioStreamMixer {
     }
 
     this.disconnectNodeGraph(
-      this.streamSourceNodeMap[key],
-      this.analyserNodeMap[key],
-      this.gainNodeMap[key]
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      this.streamSourceNodeMap.get(key)!,
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      this.analyserNodeMap.get(key)!,
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      this.gainNodeMap.get(key)!
     )
 
-    delete this.streamSourceNodeMap[key]
-    delete this.gainNodeMap[key]
-    delete this.volumeMap[key]
+    this.streamSourceNodeMap.delete(key)
+    this.gainNodeMap.delete(key)
+    this.volumeMap.delete(key)
 
-    if (Object.keys(this.gainNodeMap).length === 0) {
+    if (this.gainNodeMap.size === 0) {
       await this.context.suspend()
     }
   }
 
   public getVolumeOf(key: string) {
-    return this.gainNodeMap[key].gain.value
+    return this.gainNodeMap.get(key)?.gain.value
   }
 
   public setAndSaveVolumeOf(key: string, volume: number) {
     const v = Math.max(0, Math.min(1, volume))
-    this.setVolumeOf(key, v)
-    this.volumeMap[key] = v
+    const node = this.gainNodeMap.get(key)
+    if (!node) return
+    this.setVolumeOfGainNode(node, v)
+    this.volumeMap.set(key, v)
   }
 
-  public setVolumeOf(key: string, userVolume: number) {
-    const gainNode = this.gainNodeMap[key]
-    const value = this.calcVolumeValue(gainNode, userVolume)
-    gainNode.gain.setValueAtTime(value, this.context.currentTime)
+  public setVolumeOfGainNode(node: GainNode, userVolume: number) {
+    const value = this.calcVolumeValue(node, userVolume)
+    node.gain.setValueAtTime(value, this.context.currentTime)
   }
 
   public setfileVolume(volume: number) {
@@ -195,19 +203,20 @@ export default class AudioStreamMixer {
   }
 
   public getLevelOf(key: string) {
-    return this.getLevelOfNode(this.analyserNodeMap[key])
+    return this.getLevelOfNode(this.analyserNodeMap.get(key))
   }
 
   public muteAll() {
-    Object.keys(this.gainNodeMap).forEach(key => {
-      this.setVolumeOf(key, 0)
+    this.gainNodeMap.forEach(node => {
+      this.setVolumeOfGainNode(node, 0)
     })
   }
 
   public unmuteAll() {
-    Object.entries(this.volumeMap).forEach(([key, volume]) => {
-      if (!(key in this.gainNodeMap)) return
-      this.setVolumeOf(key, volume)
+    this.volumeMap.forEach((volume, key) => {
+      const node = this.gainNodeMap.get(key)
+      if (!node) return
+      this.setVolumeOfGainNode(node, volume)
     })
   }
 
@@ -216,8 +225,9 @@ export default class AudioStreamMixer {
     if (this.masterVolume === newMasterVolume) return
 
     this.masterVolume = newMasterVolume
-    Object.keys(this.gainNodeMap).forEach(key => {
-      this.setVolumeOf(key, this.volumeMap[key])
+    this.gainNodeMap.forEach((node, key) => {
+      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+      this.setVolumeOfGainNode(node, this.volumeMap.get(key)!)
     })
   }
   get volume() {
diff --git a/src/lib/util/file.ts b/src/lib/util/file.ts
index cc83b4b2b..1233f6353 100644
--- a/src/lib/util/file.ts
+++ b/src/lib/util/file.ts
@@ -9,12 +9,12 @@ export type AttachmentType =
   | 'file'
 
 const PDF_MIME = 'application/pdf'
-const SLIDE_MIMES = [
+const SLIDE_MIMES: ReadonlySet<string> = new Set([
   /* microsoft powerpoint */ 'application/vnd.ms-powerpoint',
   /* microsoft powerpoint */ 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
   /* libreoffice impress */ 'application/vnd.sun.xml.impress',
   /* apple keynote */ 'application/vnd.apple.keynote'
-] as const
+])
 
 export const mimeToFileType = (mime: string): AttachmentType => {
   if (mime.startsWith('image/')) {
@@ -29,7 +29,7 @@ export const mimeToFileType = (mime: string): AttachmentType => {
   if (mime === PDF_MIME) {
     return 'pdf'
   }
-  if ((SLIDE_MIMES as ReadonlyArray<string>).includes(mime)) {
+  if (SLIDE_MIMES.has(mime)) {
     return 'slide'
   }
   return 'file'
diff --git a/src/use/version.ts b/src/use/version.ts
index 266961096..9084407ab 100644
--- a/src/use/version.ts
+++ b/src/use/version.ts
@@ -1,9 +1,12 @@
-import { readonly, Ref, ref, toRaw, watchEffect } from 'vue'
+import { computed, readonly, Ref, ref, toRaw, watchEffect } from 'vue'
 import apis from '@/lib/apis'
 import { Version } from '@traptitech/traq'
 
 const useVersion = (needed: Ref<boolean> | boolean = true) => {
   const version = ref<Version>()
+  const externalLogin = computed(
+    () => new Set(version.value?.flags.externalLogin ?? [])
+  )
 
   const fetch = async () => {
     const res = await apis.getServerVersion()
@@ -15,7 +18,10 @@ const useVersion = (needed: Ref<boolean> | boolean = true) => {
     }
   })
 
-  return readonly(version)
+  return {
+    version: readonly(version),
+    externalLogin
+  }
 }
 
 export default useVersion