diff --git a/src/components/player/atoms/settings/CaptionsView.tsx b/src/components/player/atoms/settings/CaptionsView.tsx
index a9cdad9a..ea445a34 100644
--- a/src/components/player/atoms/settings/CaptionsView.tsx
+++ b/src/components/player/atoms/settings/CaptionsView.tsx
@@ -81,6 +81,7 @@ export function CaptionsView({ id }: { id: string }) {
         <CaptionOption onClick={() => disableCaption()}>Off</CaptionOption>
         {langs.map((v) => (
           <CaptionOption
+            key={v.lang}
             countryCode={v.lang}
             selected={lang === v.lang}
             onClick={() => updateCaption()}
diff --git a/src/components/player/internals/VideoContainer.tsx b/src/components/player/internals/VideoContainer.tsx
index 898fbb4e..a9e22eb5 100644
--- a/src/components/player/internals/VideoContainer.tsx
+++ b/src/components/player/internals/VideoContainer.tsx
@@ -1,10 +1,7 @@
 import { ReactNode, useEffect, useMemo, useRef } from "react";
 
 import { makeVideoElementDisplayInterface } from "@/components/player/display/base";
-import {
-  convertSubtitlesToVtt,
-  vttToDataurl,
-} from "@/components/player/utils/captions";
+import { convertSubtitlesToDataurl } from "@/components/player/utils/captions";
 import { playerStatus } from "@/stores/player/slices/source";
 import { usePlayerStore } from "@/stores/player/store";
 
@@ -47,10 +44,9 @@ function VideoElement() {
   const captionAsTrack = usePlayerStore((s) => s.caption.asTrack);
   const language = usePlayerStore((s) => s.caption.selected?.language);
 
-  const trackData = useMemo(
-    () => (srtData ? vttToDataurl(convertSubtitlesToVtt(srtData)) : null),
-    [srtData]
-  );
+  const trackData = useMemo(() => {
+    return srtData ? convertSubtitlesToDataurl(srtData) : null;
+  }, [srtData]);
 
   // report video element to display interface
   useEffect(() => {
diff --git a/src/components/player/utils/captions.ts b/src/components/player/utils/captions.ts
index 1a4d2183..64fa4691 100644
--- a/src/components/player/utils/captions.ts
+++ b/src/components/player/utils/captions.ts
@@ -40,8 +40,6 @@ export function parseSubtitles(text: string): CaptionCueType[] {
   return parse(vtt).filter((cue) => cue.type === "caption") as CaptionCueType[];
 }
 
-export function vttToDataurl(vtt: string): string {
-  const bytes = new TextEncoder().encode(vtt);
-  const encoded = btoa(String.fromCodePoint(...bytes));
-  return `data:text/vtt;base64,${encoded}`;
+export function convertSubtitlesToDataurl(text: string): string {
+  return `data:text/vtt;${convertSubtitlesToVtt(text)}`;
 }