WEBVTT Kind: captions Language: en 00:00:00.480 --> 00:00:03.149 align:start position:0% hey<00:00:00.680> everyone<00:00:01.120> welcome<00:00:01.400> to<00:00:01.520> nning<00:00:01.920> IO<00:00:02.440> I'm<00:00:02.600> JD 00:00:03.149 --> 00:00:03.159 align:start position:0% hey everyone welcome to nning IO I'm JD 00:00:03.159 --> 00:00:05.190 align:start position:0% hey everyone welcome to nning IO I'm JD and<00:00:03.320> today<00:00:03.679> we're<00:00:03.800> going<00:00:03.919> to<00:00:04.040> be<00:00:04.200> looking<00:00:04.600> at 00:00:05.190 --> 00:00:05.200 align:start position:0% and today we're going to be looking at 00:00:05.200 --> 00:00:09.270 align:start position:0% and today we're going to be looking at real<00:00:05.640> time<00:00:06.120> in<00:00:06.600> browser<00:00:07.600> speech<00:00:08.280> recognition 00:00:09.270 --> 00:00:09.280 align:start position:0% real time in browser speech recognition 00:00:09.280 --> 00:00:12.589 align:start position:0% real time in browser speech recognition using<00:00:09.719> web<00:00:09.960> GPU<00:00:10.719> and<00:00:10.920> Transformer<00:00:11.519> JS<00:00:12.360> to 00:00:12.589 --> 00:00:12.599 align:start position:0% using web GPU and Transformer JS to 00:00:12.599 --> 00:00:15.390 align:start position:0% using web GPU and Transformer JS to actually<00:00:12.960> use<00:00:13.280> speech<00:00:13.759> in<00:00:13.920> the<00:00:14.200> browser<00:00:15.200> so 00:00:15.390 --> 00:00:15.400 align:start position:0% actually use speech in the browser so 00:00:15.400 --> 00:00:17.670 align:start position:0% actually use speech in the browser so with<00:00:15.559> that<00:00:15.719> let's<00:00:15.920> go<00:00:16.039> ahead<00:00:16.199> and<00:00:16.320> get 00:00:17.670 --> 00:00:17.680 align:start position:0% with that let's go ahead and get 00:00:17.680 --> 00:00:19.710 align:start position:0% with that let's go ahead and get started<00:00:18.680> all<00:00:18.800> right<00:00:19.039> the<00:00:19.240> first<00:00:19.480> thing<00:00:19.640> that 00:00:19.710 --> 00:00:19.720 align:start position:0% started all right the first thing that 00:00:19.720 --> 00:00:20.870 align:start position:0% started all right the first thing that we're<00:00:19.840> going<00:00:19.960> to<00:00:20.080> do<00:00:20.320> everyone<00:00:20.640> is<00:00:20.760> we're 00:00:20.870 --> 00:00:20.880 align:start position:0% we're going to do everyone is we're 00:00:20.880 --> 00:00:24.269 align:start position:0% we're going to do everyone is we're going<00:00:21.000> to<00:00:21.240> go<00:00:21.519> to<00:00:22.439> this<00:00:22.720> hugging<00:00:23.160> face<00:00:23.519> space 00:00:24.269 --> 00:00:24.279 align:start position:0% going to go to this hugging face space 00:00:24.279 --> 00:00:26.150 align:start position:0% going to go to this hugging face space and<00:00:24.560> basically<00:00:25.039> what<00:00:25.160> we're<00:00:25.320> going<00:00:25.439> to<00:00:25.599> do<00:00:26.000> is 00:00:26.150 --> 00:00:26.160 align:start position:0% and basically what we're going to do is 00:00:26.160 --> 00:00:28.710 align:start position:0% and basically what we're going to do is look<00:00:26.320> at<00:00:26.480> this<00:00:26.640> demo<00:00:27.000> for<00:00:27.359> the<00:00:27.519> whisper<00:00:28.480> web 00:00:28.710 --> 00:00:28.720 align:start position:0% look at this demo for the whisper web 00:00:28.720 --> 00:00:31.389 align:start position:0% look at this demo for the whisper web GPO<00:00:29.599> uh<00:00:29.720> it's<00:00:30.199> real<00:00:30.560> time<00:00:30.720> in<00:00:30.920> browser 00:00:31.389 --> 00:00:31.399 align:start position:0% GPO uh it's real time in browser 00:00:31.399 --> 00:00:33.709 align:start position:0% GPO uh it's real time in browser recognition<00:00:32.399> it's<00:00:32.599> using<00:00:32.840> the<00:00:32.960> whisper<00:00:33.360> base 00:00:33.709 --> 00:00:33.719 align:start position:0% recognition it's using the whisper base 00:00:33.719 --> 00:00:36.510 align:start position:0% recognition it's using the whisper base which<00:00:33.840> is<00:00:33.920> a<00:00:34.120> 73<00:00:35.000> million<00:00:35.480> parameter<00:00:36.120> speech 00:00:36.510 --> 00:00:36.520 align:start position:0% which is a 73 million parameter speech 00:00:36.520 --> 00:00:39.950 align:start position:0% which is a 73 million parameter speech recognition<00:00:37.160> mod<00:00:37.680> model<00:00:38.680> and<00:00:39.160> using<00:00:39.440> onx<00:00:39.800> and 00:00:39.950 --> 00:00:39.960 align:start position:0% recognition mod model and using onx and 00:00:39.960 --> 00:00:42.790 align:start position:0% recognition mod model and using onx and Transformer<00:00:40.480> JS<00:00:40.960> so<00:00:41.920> you<00:00:42.079> can<00:00:42.239> see<00:00:42.520> that<00:00:42.640> the 00:00:42.790 --> 00:00:42.800 align:start position:0% Transformer JS so you can see that the 00:00:42.800 --> 00:00:44.990 align:start position:0% Transformer JS so you can see that the audio<00:00:43.399> audio<00:00:43.800> visualizer<00:00:44.399> is<00:00:44.520> already 00:00:44.990 --> 00:00:45.000 align:start position:0% audio audio visualizer is already 00:00:45.000 --> 00:00:47.750 align:start position:0% audio audio visualizer is already picking<00:00:45.320> up<00:00:45.520> my<00:00:45.719> voice<00:00:46.239> from<00:00:46.559> the<00:00:46.760> microphone 00:00:47.750 --> 00:00:47.760 align:start position:0% picking up my voice from the microphone 00:00:47.760 --> 00:00:52.510 align:start position:0% picking up my voice from the microphone and<00:00:48.480> uh<00:00:48.600> able<00:00:48.840> to<00:00:49.000> do<00:00:49.840> some<00:00:50.160> kind<00:00:50.399> of<00:00:51.160> uh<00:00:51.520> visual 00:00:52.510 --> 00:00:52.520 align:start position:0% and uh able to do some kind of uh visual 00:00:52.520 --> 00:00:53.950 align:start position:0% and uh able to do some kind of uh visual what<00:00:52.640> we're<00:00:52.760> going<00:00:52.840> to<00:00:53.000> do<00:00:53.199> is<00:00:53.399> actually<00:00:53.600> load 00:00:53.950 --> 00:00:53.960 align:start position:0% what we're going to do is actually load 00:00:53.960 --> 00:00:55.229 align:start position:0% what we're going to do is actually load this<00:00:54.079> model<00:00:54.480> and<00:00:54.559> then<00:00:54.680> we<00:00:54.760> should<00:00:54.879> be<00:00:55.000> able<00:00:55.160> to 00:00:55.229 --> 00:00:55.239 align:start position:0% this model and then we should be able to 00:00:55.239 --> 00:00:58.990 align:start position:0% this model and then we should be able to see<00:00:55.520> real<00:00:55.800> time<00:00:56.600> uh<00:00:56.760> transcription<00:00:57.840> but<00:00:58.840> what 00:00:58.990 --> 00:00:59.000 align:start position:0% see real time uh transcription but what 00:00:59.000 --> 00:01:00.430 align:start position:0% see real time uh transcription but what we<00:00:59.160> want<00:00:59.399> to<00:00:59.600> show 00:01:00.430 --> 00:01:00.440 align:start position:0% we want to show 00:01:00.440 --> 00:01:04.149 align:start position:0% we want to show is<00:01:00.719> also<00:01:01.160> that<00:01:01.359> if<00:01:01.480> you<00:01:01.800> go<00:01:02.160> and<00:01:02.480> look<00:01:02.879> at<00:01:03.239> your 00:01:04.149 --> 00:01:04.159 align:start position:0% is also that if you go and look at your 00:01:04.159 --> 00:01:06.670 align:start position:0% is also that if you go and look at your network<00:01:05.159> uh<00:01:05.400> right<00:01:05.560> now<00:01:05.760> I<00:01:05.840> have<00:01:06.200> I'm<00:01:06.320> on<00:01:06.479> this 00:01:06.670 --> 00:01:06.680 align:start position:0% network uh right now I have I'm on this 00:01:06.680 --> 00:01:09.590 align:start position:0% network uh right now I have I'm on this wasm<00:01:07.280> tab<00:01:08.280> and<00:01:08.600> we<00:01:08.720> want<00:01:08.840> to<00:01:09.000> pay<00:01:09.159> attention<00:01:09.439> to 00:01:09.590 --> 00:01:09.600 align:start position:0% wasm tab and we want to pay attention to 00:01:09.600 --> 00:01:11.910 align:start position:0% wasm tab and we want to pay attention to both<00:01:09.840> Fetch<00:01:10.720> and<00:01:10.920> wasm<00:01:11.360> so<00:01:11.479> we're<00:01:11.600> going<00:01:11.680> to<00:01:11.799> go 00:01:11.910 --> 00:01:11.920 align:start position:0% both Fetch and wasm so we're going to go 00:01:11.920 --> 00:01:15.789 align:start position:0% both Fetch and wasm so we're going to go ahead<00:01:12.240> and<00:01:12.479> look<00:01:12.840> at<00:01:13.840> the<00:01:14.280> model<00:01:15.280> and<00:01:15.520> you<00:01:15.640> can 00:01:15.789 --> 00:01:15.799 align:start position:0% ahead and look at the model and you can 00:01:15.799 --> 00:01:17.950 align:start position:0% ahead and look at the model and you can see<00:01:16.119> it<00:01:16.280> pulled<00:01:16.520> it<00:01:16.640> in<00:01:16.880> really<00:01:17.119> quickly<00:01:17.759> uh 00:01:17.950 --> 00:01:17.960 align:start position:0% see it pulled it in really quickly uh 00:01:17.960 --> 00:01:22.670 align:start position:0% see it pulled it in really quickly uh could<00:01:18.600> be<00:01:19.600> uh<00:01:19.759> because<00:01:20.040> it's<00:01:20.560> cached<00:01:21.560> but<00:01:22.280> uh 00:01:22.670 --> 00:01:22.680 align:start position:0% could be uh because it's cached but uh 00:01:22.680 --> 00:01:24.510 align:start position:0% could be uh because it's cached but uh this<00:01:22.840> was<00:01:23.240> incredibly<00:01:23.759> fast<00:01:24.159> and<00:01:24.280> it's 00:01:24.510 --> 00:01:24.520 align:start position:0% this was incredibly fast and it's 00:01:24.520 --> 00:01:28.149 align:start position:0% this was incredibly fast and it's already<00:01:24.880> doing<00:01:25.400> the<00:01:26.240> the<00:01:26.920> transcription<00:01:27.920> in 00:01:28.149 --> 00:01:28.159 align:start position:0% already doing the the transcription in 00:01:28.159 --> 00:01:30.069 align:start position:0% already doing the the transcription in real<00:01:28.520> time<00:01:29.040> you<00:01:29.119> can<00:01:29.240> see<00:01:29.439> that<00:01:29.520> it's<00:01:29.640> trying 00:01:30.069 --> 00:01:30.079 align:start position:0% real time you can see that it's trying 00:01:30.079 --> 00:01:30.950 align:start position:0% real time you can see that it's trying add 00:01:30.950 --> 00:01:30.960 align:start position:0% add 00:01:30.960 --> 00:01:34.109 align:start position:0% add punctuation<00:01:31.960> and<00:01:32.720> uh<00:01:32.880> the<00:01:33.040> token<00:01:33.479> count<00:01:33.840> down 00:01:34.109 --> 00:01:34.119 align:start position:0% punctuation and uh the token count down 00:01:34.119 --> 00:01:36.590 align:start position:0% punctuation and uh the token count down here<00:01:34.920> if<00:01:35.040> we<00:01:35.159> go<00:01:35.280> over<00:01:35.399> to<00:01:35.520> the<00:01:35.680> wasm<00:01:36.119> tab<00:01:36.479> this 00:01:36.590 --> 00:01:36.600 align:start position:0% here if we go over to the wasm tab this 00:01:36.600 --> 00:01:38.550 align:start position:0% here if we go over to the wasm tab this is<00:01:36.720> all<00:01:36.880> that<00:01:37.000> was<00:01:37.159> loaded<00:01:38.040> it's<00:01:38.240> going 00:01:38.550 --> 00:01:38.560 align:start position:0% is all that was loaded it's going 00:01:38.560 --> 00:01:40.910 align:start position:0% is all that was loaded it's going through<00:01:39.040> a<00:01:39.240> worker<00:01:39.840> to<00:01:40.240> establish<00:01:40.680> this<00:01:40.799> and 00:01:40.910 --> 00:01:40.920 align:start position:0% through a worker to establish this and 00:01:40.920 --> 00:01:44.270 align:start position:0% through a worker to establish this and the<00:01:41.079> size<00:01:41.360> was<00:01:41.920> 4<00:01:42.560> megabytes<00:01:43.560> so<00:01:43.960> again<00:01:44.159> this 00:01:44.270 --> 00:01:44.280 align:start position:0% the size was 4 megabytes so again this 00:01:44.280 --> 00:01:48.030 align:start position:0% the size was 4 megabytes so again this is<00:01:44.560> crazy<00:01:45.079> fast<00:01:45.360> for<00:01:45.560> doing<00:01:46.240> real<00:01:46.680> time<00:01:47.680> uh 00:01:48.030 --> 00:01:48.040 align:start position:0% is crazy fast for doing real time uh 00:01:48.040 --> 00:01:49.749 align:start position:0% is crazy fast for doing real time uh transcription<00:01:48.680> in<00:01:48.840> the<00:01:49.000> browser<00:01:49.479> super 00:01:49.749 --> 00:01:49.759 align:start position:0% transcription in the browser super 00:01:49.759 --> 00:01:54.069 align:start position:0% transcription in the browser super helpful<00:01:50.280> if<00:01:50.399> you<00:01:50.520> were<00:01:50.799> trying<00:01:51.079> to<00:01:51.520> do<00:01:52.680> uh<00:01:53.680> like 00:01:54.069 --> 00:01:54.079 align:start position:0% helpful if you were trying to do uh like 00:01:54.079 --> 00:01:56.190 align:start position:0% helpful if you were trying to do uh like chat<00:01:54.479> based<00:01:55.200> systems<00:01:55.680> where<00:01:55.799> you<00:01:56.000> actually 00:01:56.190 --> 00:01:56.200 align:start position:0% chat based systems where you actually 00:01:56.200 --> 00:01:58.789 align:start position:0% chat based systems where you actually wanted<00:01:56.439> to<00:01:56.640> have<00:01:57.079> voice<00:01:57.399> in<00:01:57.600> with<00:01:57.759> your<00:01:57.920> chat 00:01:58.789 --> 00:01:58.799 align:start position:0% wanted to have voice in with your chat 00:01:58.799 --> 00:02:02.870 align:start position:0% wanted to have voice in with your chat as<00:01:59.320> without<00:02:00.079> having<00:02:00.280> to<00:02:00.479> go<00:02:00.719> out<00:02:01.000> to<00:02:01.479> open<00:02:01.880> AI 00:02:02.870 --> 00:02:02.880 align:start position:0% as without having to go out to open AI 00:02:02.880 --> 00:02:04.709 align:start position:0% as without having to go out to open AI or<00:02:03.159> some<00:02:03.360> other 00:02:04.709 --> 00:02:04.719 align:start position:0% or some other 00:02:04.719 --> 00:02:07.429 align:start position:0% or some other um<00:02:05.719> closed<00:02:06.159> Source<00:02:06.479> or<00:02:06.640> even<00:02:06.880> open<00:02:07.159> source 00:02:07.429 --> 00:02:07.439 align:start position:0% um closed Source or even open source 00:02:07.439 --> 00:02:11.430 align:start position:0% um closed Source or even open source model<00:02:07.799> that<00:02:08.720> uh<00:02:09.000> requires<00:02:09.520> a<00:02:09.879> backend<00:02:10.879> call 00:02:11.430 --> 00:02:11.440 align:start position:0% model that uh requires a backend call 00:02:11.440 --> 00:02:13.150 align:start position:0% model that uh requires a backend call right<00:02:11.640> again<00:02:11.879> we<00:02:12.000> didn't<00:02:12.319> fetch<00:02:12.760> anything 00:02:13.150 --> 00:02:13.160 align:start position:0% right again we didn't fetch anything 00:02:13.160 --> 00:02:14.550 align:start position:0% right again we didn't fetch anything from<00:02:13.319> our<00:02:13.520> back<00:02:13.640> end<00:02:13.879> this<00:02:14.000> was<00:02:14.120> just<00:02:14.239> loaded 00:02:14.550 --> 00:02:14.560 align:start position:0% from our back end this was just loaded 00:02:14.560 --> 00:02:17.430 align:start position:0% from our back end this was just loaded through<00:02:14.680> the<00:02:15.280> browser<00:02:16.280> so<00:02:17.040> now<00:02:17.200> what<00:02:17.319> we're 00:02:17.430 --> 00:02:17.440 align:start position:0% through the browser so now what we're 00:02:17.440 --> 00:02:19.470 align:start position:0% through the browser so now what we're going<00:02:17.560> to<00:02:17.720> do<00:02:18.080> is<00:02:18.200> we're<00:02:18.360> going<00:02:18.480> to<00:02:18.680> take<00:02:19.000> this 00:02:19.470 --> 00:02:19.480 align:start position:0% going to do is we're going to take this 00:02:19.480 --> 00:02:22.670 align:start position:0% going to do is we're going to take this and<00:02:19.760> we're<00:02:20.319> going<00:02:20.440> to<00:02:20.720> actually<00:02:21.040> look<00:02:21.440> at<00:02:21.920> the 00:02:22.670 --> 00:02:22.680 align:start position:0% and we're going to actually look at the 00:02:22.680 --> 00:02:26.110 align:start position:0% and we're going to actually look at the repo<00:02:23.599> and<00:02:24.040> and<00:02:24.160> dig<00:02:24.360> into<00:02:24.560> the<00:02:24.720> code<00:02:25.720> so<00:02:25.879> if<00:02:25.959> you 00:02:26.110 --> 00:02:26.120 align:start position:0% repo and and dig into the code so if you 00:02:26.120 --> 00:02:29.949 align:start position:0% repo and and dig into the code so if you come<00:02:26.360> over<00:02:26.640> here<00:02:27.080> to<00:02:27.560> Transformers<00:02:28.440> Js 00:02:29.949 --> 00:02:29.959 align:start position:0% come over here to Transformers Js 00:02:29.959 --> 00:02:31.150 align:start position:0% come over here to Transformers Js the<00:02:30.040> thing<00:02:30.200> you<00:02:30.280> want<00:02:30.400> to<00:02:30.519> note<00:02:30.800> is<00:02:30.959> you<00:02:31.080> want 00:02:31.150 --> 00:02:31.160 align:start position:0% the thing you want to note is you want 00:02:31.160 --> 00:02:34.390 align:start position:0% the thing you want to note is you want to<00:02:31.319> be<00:02:31.920> on<00:02:32.920> uh<00:02:33.160> the 00:02:34.390 --> 00:02:34.400 align:start position:0% to be on uh the 00:02:34.400 --> 00:02:38.309 align:start position:0% to be on uh the V3<00:02:35.440> Branch<00:02:36.440> this<00:02:36.560> is<00:02:36.879> the<00:02:37.560> the<00:02:37.680> new<00:02:38.000> Branch 00:02:38.309 --> 00:02:38.319 align:start position:0% V3 Branch this is the the new Branch 00:02:38.319 --> 00:02:39.790 align:start position:0% V3 Branch this is the the new Branch it's<00:02:38.440> still<00:02:38.720> experimental<00:02:39.400> but<00:02:39.519> it's<00:02:39.720> going 00:02:39.790 --> 00:02:39.800 align:start position:0% it's still experimental but it's going 00:02:39.800 --> 00:02:42.670 align:start position:0% it's still experimental but it's going to<00:02:39.920> be<00:02:40.040> the<00:02:40.159> next<00:02:40.360> version<00:02:40.640> of<00:02:40.800> Transformer<00:02:41.680> JS 00:02:42.670 --> 00:02:42.680 align:start position:0% to be the next version of Transformer JS 00:02:42.680 --> 00:02:44.070 align:start position:0% to be the next version of Transformer JS a<00:02:42.760> lot<00:02:42.920> of<00:02:43.080> great<00:02:43.280> examples<00:02:43.800> we've<00:02:43.959> been 00:02:44.070 --> 00:02:44.080 align:start position:0% a lot of great examples we've been 00:02:44.080 --> 00:02:45.350 align:start position:0% a lot of great examples we've been trying<00:02:44.239> to<00:02:44.360> go<00:02:44.480> through<00:02:44.680> some<00:02:44.840> of<00:02:45.000> them<00:02:45.239> it 00:02:45.350 --> 00:02:45.360 align:start position:0% trying to go through some of them it 00:02:45.360 --> 00:02:46.910 align:start position:0% trying to go through some of them it feels<00:02:45.599> like<00:02:45.879> every<00:02:46.080> day<00:02:46.200> they're<00:02:46.400> coming<00:02:46.640> out 00:02:46.910 --> 00:02:46.920 align:start position:0% feels like every day they're coming out 00:02:46.920 --> 00:02:49.869 align:start position:0% feels like every day they're coming out with<00:02:47.480> a<00:02:47.640> new<00:02:48.400> demo<00:02:48.840> a<00:02:48.959> new<00:02:49.200> model<00:02:49.560> that<00:02:49.680> they're 00:02:49.869 --> 00:02:49.879 align:start position:0% with a new demo a new model that they're 00:02:49.879 --> 00:02:52.070 align:start position:0% with a new demo a new model that they're able<00:02:50.080> to<00:02:50.319> implement<00:02:51.120> um<00:02:51.440> definitely<00:02:51.879> really 00:02:52.070 --> 00:02:52.080 align:start position:0% able to implement um definitely really 00:02:52.080 --> 00:02:56.949 align:start position:0% able to implement um definitely really cool<00:02:52.519> stuff<00:02:53.519> so<00:02:54.519> if<00:02:54.760> we<00:02:55.400> look<00:02:55.599> at<00:02:55.879> this<00:02:56.519> example 00:02:56.949 --> 00:02:56.959 align:start position:0% cool stuff so if we look at this example 00:02:56.959 --> 00:02:59.110 align:start position:0% cool stuff so if we look at this example so<00:02:57.120> we<00:02:57.239> go<00:02:57.400> into<00:02:57.800> Transformer<00:02:58.319> JS<00:02:58.760> examples 00:02:59.110 --> 00:02:59.120 align:start position:0% so we go into Transformer JS examples 00:02:59.120 --> 00:03:00.949 align:start position:0% so we go into Transformer JS examples and<00:02:59.319> Whisper<00:02:59.959> then<00:03:00.040> we're<00:03:00.200> able<00:03:00.400> to<00:03:00.599> actually 00:03:00.949 --> 00:03:00.959 align:start position:0% and Whisper then we're able to actually 00:03:00.959 --> 00:03:04.229 align:start position:0% and Whisper then we're able to actually D<00:03:01.480> dive<00:03:01.760> into<00:03:02.000> this<00:03:02.640> code<00:03:03.640> so<00:03:04.040> what<00:03:04.120> we're 00:03:04.229 --> 00:03:04.239 align:start position:0% D dive into this code so what we're 00:03:04.239 --> 00:03:05.270 align:start position:0% D dive into this code so what we're going<00:03:04.319> to<00:03:04.440> do<00:03:04.560> is<00:03:04.640> we're<00:03:04.799> just<00:03:04.879> going<00:03:05.000> to<00:03:05.080> pull 00:03:05.270 --> 00:03:05.280 align:start position:0% going to do is we're just going to pull 00:03:05.280 --> 00:03:06.750 align:start position:0% going to do is we're just going to pull this<00:03:05.440> down<00:03:05.760> get<00:03:05.879> this<00:03:06.000> running<00:03:06.280> on<00:03:06.400> our<00:03:06.519> local 00:03:06.750 --> 00:03:06.760 align:start position:0% this down get this running on our local 00:03:06.760 --> 00:03:08.949 align:start position:0% this down get this running on our local machine<00:03:07.519> and<00:03:07.879> then<00:03:08.000> we'll<00:03:08.159> start<00:03:08.480> digging 00:03:08.949 --> 00:03:08.959 align:start position:0% machine and then we'll start digging 00:03:08.959 --> 00:03:12.550 align:start position:0% machine and then we'll start digging into<00:03:09.519> the<00:03:10.040> code<00:03:11.040> so<00:03:11.200> I'm<00:03:11.280> going<00:03:11.400> to<00:03:11.519> use<00:03:11.840> cursor 00:03:12.550 --> 00:03:12.560 align:start position:0% into the code so I'm going to use cursor 00:03:12.560 --> 00:03:13.949 align:start position:0% into the code so I'm going to use cursor I'm<00:03:12.720> already<00:03:13.159> I<00:03:13.239> already<00:03:13.400> have<00:03:13.519> it<00:03:13.640> pulled 00:03:13.949 --> 00:03:13.959 align:start position:0% I'm already I already have it pulled 00:03:13.959 --> 00:03:18.070 align:start position:0% I'm already I already have it pulled down<00:03:14.200> but<00:03:14.319> you<00:03:14.400> can<00:03:14.599> do<00:03:15.560> uh<00:03:16.000> get<00:03:16.680> clone<00:03:17.680> and 00:03:18.070 --> 00:03:18.080 align:start position:0% down but you can do uh get clone and 00:03:18.080 --> 00:03:20.509 align:start position:0% down but you can do uh get clone and then<00:03:18.799> come<00:03:19.000> over 00:03:20.509 --> 00:03:20.519 align:start position:0% then come over 00:03:20.519 --> 00:03:24.990 align:start position:0% then come over here<00:03:21.519> and<00:03:21.959> just<00:03:22.200> do 00:03:24.990 --> 00:03:25.000 align:start position:0% here and just do 00:03:25.000 --> 00:03:29.149 align:start position:0% here and just do this<00:03:26.480> uh<00:03:27.480> we<00:03:27.680> are<00:03:28.120> so<00:03:28.400> I'm<00:03:28.519> in<00:03:28.640> the<00:03:28.760> root<00:03:29.040> so 00:03:29.149 --> 00:03:29.159 align:start position:0% this uh we are so I'm in the root so 00:03:29.159 --> 00:03:31.550 align:start position:0% this uh we are so I'm in the root so what<00:03:29.280> we<00:03:29.360> need<00:03:29.480> to<00:03:29.560> do<00:03:29.840> is<00:03:30.000> go<00:03:30.159> to 00:03:31.550 --> 00:03:31.560 align:start position:0% what we need to do is go to 00:03:31.560 --> 00:03:34.630 align:start position:0% what we need to do is go to examples<00:03:32.560> and<00:03:32.680> then<00:03:32.840> we're<00:03:33.000> going<00:03:33.080> to<00:03:33.239> do<00:03:33.480> web 00:03:34.630 --> 00:03:34.640 align:start position:0% examples and then we're going to do web 00:03:34.640 --> 00:03:36.630 align:start position:0% examples and then we're going to do web GPU<00:03:35.640> and<00:03:35.799> go<00:03:35.920> to 00:03:36.630 --> 00:03:36.640 align:start position:0% GPU and go to 00:03:36.640 --> 00:03:41.390 align:start position:0% GPU and go to whisper<00:03:37.640> and<00:03:37.840> we'll<00:03:38.000> do<00:03:38.120> an<00:03:38.280> npm 00:03:41.390 --> 00:03:41.400 align:start position:0% 00:03:41.400 --> 00:03:43.750 align:start position:0% install<00:03:42.400> and<00:03:42.640> then<00:03:42.879> we'll<00:03:43.120> go<00:03:43.319> ahead<00:03:43.519> and<00:03:43.640> do 00:03:43.750 --> 00:03:43.760 align:start position:0% install and then we'll go ahead and do 00:03:43.760 --> 00:03:47.710 align:start position:0% install and then we'll go ahead and do an<00:03:44.040> npm<00:03:45.040> run 00:03:47.710 --> 00:03:47.720 align:start position:0% 00:03:47.720 --> 00:03:49.670 align:start position:0% Dev<00:03:48.720> and<00:03:48.920> what<00:03:49.000> we're<00:03:49.120> going<00:03:49.239> to<00:03:49.319> do<00:03:49.439> is<00:03:49.560> we 00:03:49.670 --> 00:03:49.680 align:start position:0% Dev and what we're going to do is we 00:03:49.680 --> 00:03:51.470 align:start position:0% Dev and what we're going to do is we have<00:03:49.760> our<00:03:49.920> Local<00:03:50.239> Host<00:03:50.640> here<00:03:50.920> so<00:03:51.120> we<00:03:51.200> can<00:03:51.319> get 00:03:51.470 --> 00:03:51.480 align:start position:0% have our Local Host here so we can get 00:03:51.480 --> 00:03:53.309 align:start position:0% have our Local Host here so we can get this<00:03:51.599> up<00:03:51.720> and<00:03:51.840> running<00:03:52.360> we'll<00:03:52.680> watch<00:03:53.040> really 00:03:53.309 --> 00:03:53.319 align:start position:0% this up and running we'll watch really 00:03:53.319 --> 00:03:55.750 align:start position:0% this up and running we'll watch really quickly<00:03:53.760> if<00:03:53.959> we<00:03:54.079> can<00:03:54.360> get 00:03:55.750 --> 00:03:55.760 align:start position:0% quickly if we can get 00:03:55.760 --> 00:04:00.069 align:start position:0% quickly if we can get this<00:03:56.760> uh<00:03:57.560> loaded<00:03:58.560> again<00:03:58.920> super<00:03:59.239> quick<00:03:59.439> you<00:03:59.799> saw 00:04:00.069 --> 00:04:00.079 align:start position:0% this uh loaded again super quick you saw 00:04:00.079 --> 00:04:03.030 align:start position:0% this uh loaded again super quick you saw how<00:04:00.280> quickly<00:04:00.799> the<00:04:01.760> the<00:04:02.079> load<00:04:02.400> time<00:04:02.640> was<00:04:02.799> for 00:04:03.030 --> 00:04:03.040 align:start position:0% how quickly the the load time was for 00:04:03.040 --> 00:04:05.190 align:start position:0% how quickly the the load time was for that<00:04:03.319> again<00:04:04.159> some<00:04:04.319> of<00:04:04.480> it<00:04:04.840> sometimes<00:04:05.000> it's 00:04:05.190 --> 00:04:05.200 align:start position:0% that again some of it sometimes it's 00:04:05.200 --> 00:04:06.390 align:start position:0% that again some of it sometimes it's cashed<00:04:05.480> and<00:04:05.599> the<00:04:05.720> first<00:04:05.879> one's<00:04:06.120> going<00:04:06.200> to<00:04:06.280> be 00:04:06.390 --> 00:04:06.400 align:start position:0% cashed and the first one's going to be 00:04:06.400 --> 00:04:08.270 align:start position:0% cashed and the first one's going to be slower<00:04:06.840> but<00:04:07.040> still<00:04:07.400> really 00:04:08.270 --> 00:04:08.280 align:start position:0% slower but still really 00:04:08.280 --> 00:04:11.630 align:start position:0% slower but still really impressive<00:04:09.439> so<00:04:10.439> if<00:04:10.599> we<00:04:10.879> look<00:04:11.079> at<00:04:11.239> some<00:04:11.400> of<00:04:11.519> the 00:04:11.630 --> 00:04:11.640 align:start position:0% impressive so if we look at some of the 00:04:11.640 --> 00:04:16.110 align:start position:0% impressive so if we look at some of the core<00:04:11.879> files<00:04:12.200> in<00:04:12.439> here<00:04:13.079> we<00:04:13.319> have<00:04:13.760> our<00:04:14.560> app<00:04:15.560> which 00:04:16.110 --> 00:04:16.120 align:start position:0% core files in here we have our app which 00:04:16.120 --> 00:04:20.270 align:start position:0% core files in here we have our app which is<00:04:16.959> the<00:04:17.680> main<00:04:18.440> main<00:04:18.919> file<00:04:19.919> and<00:04:20.040> what<00:04:20.160> we're 00:04:20.270 --> 00:04:20.280 align:start position:0% is the main main file and what we're 00:04:20.280 --> 00:04:22.270 align:start position:0% is the main main file and what we're going<00:04:20.400> to<00:04:20.479> be<00:04:20.639> looking<00:04:20.959> at<00:04:21.400> is<00:04:21.919> how<00:04:22.079> we're 00:04:22.270 --> 00:04:22.280 align:start position:0% going to be looking at is how we're 00:04:22.280 --> 00:04:25.150 align:start position:0% going to be looking at is how we're actually<00:04:22.560> pulling<00:04:22.840> in<00:04:23.040> this<00:04:23.360> worker<00:04:24.360> so<00:04:24.759> this 00:04:25.150 --> 00:04:25.160 align:start position:0% actually pulling in this worker so this 00:04:25.160 --> 00:04:27.670 align:start position:0% actually pulling in this worker so this worker.<00:04:25.919> JS<00:04:26.479> is<00:04:26.639> where<00:04:26.800> we're<00:04:27.040> actually<00:04:27.479> going 00:04:27.670 --> 00:04:27.680 align:start position:0% worker. JS is where we're actually going 00:04:27.680 --> 00:04:30.430 align:start position:0% worker. JS is where we're actually going to<00:04:27.919> do<00:04:28.120> our<00:04:28.320> Logic<00:04:28.639> for<00:04:28.800> Transformer<00:04:29.320> Js<00:04:30.199> we're 00:04:30.430 --> 00:04:30.440 align:start position:0% to do our Logic for Transformer Js we're 00:04:30.440 --> 00:04:32.270 align:start position:0% to do our Logic for Transformer Js we're pulling<00:04:30.759> in<00:04:30.880> the<00:04:31.039> model<00:04:31.759> we're<00:04:32.000> actually 00:04:32.270 --> 00:04:32.280 align:start position:0% pulling in the model we're actually 00:04:32.280 --> 00:04:34.150 align:start position:0% pulling in the model we're actually sending<00:04:32.720> messages<00:04:33.280> back<00:04:33.400> and<00:04:33.600> forth<00:04:34.039> where 00:04:34.150 --> 00:04:34.160 align:start position:0% sending messages back and forth where 00:04:34.160 --> 00:04:37.670 align:start position:0% sending messages back and forth where you<00:04:34.280> can<00:04:34.400> see<00:04:34.720> right<00:04:34.960> here<00:04:35.960> that<00:04:36.440> as<00:04:36.840> messages 00:04:37.670 --> 00:04:37.680 align:start position:0% you can see right here that as messages 00:04:37.680 --> 00:04:41.070 align:start position:0% you can see right here that as messages are<00:04:37.960> coming<00:04:38.840> being<00:04:39.440> received<00:04:40.360> we're<00:04:40.720> actually 00:04:41.070 --> 00:04:41.080 align:start position:0% are coming being received we're actually 00:04:41.080 --> 00:04:44.189 align:start position:0% are coming being received we're actually going<00:04:41.560> to<00:04:42.560> be<00:04:42.800> looking<00:04:43.360> for<00:04:43.600> the<00:04:43.800> type<00:04:43.960> of 00:04:44.189 --> 00:04:44.199 align:start position:0% going to be looking for the type of 00:04:44.199 --> 00:04:48.909 align:start position:0% going to be looking for the type of event<00:04:44.919> that<00:04:45.039> is<00:04:45.199> being<00:04:45.800> pass<00:04:46.800> and<00:04:47.080> then<00:04:48.080> send 00:04:48.909 --> 00:04:48.919 align:start position:0% event that is being pass and then send 00:04:48.919 --> 00:04:52.749 align:start position:0% event that is being pass and then send that<00:04:49.720> uh<00:04:49.960> data<00:04:50.840> as<00:04:51.240> well 00:04:52.749 --> 00:04:52.759 align:start position:0% that uh data as well 00:04:52.759 --> 00:04:55.629 align:start position:0% that uh data as well so<00:04:53.759> you<00:04:53.880> can<00:04:54.000> see<00:04:54.320> most<00:04:54.479> of<00:04:54.680> this<00:04:54.800> is<00:04:55.000> for<00:04:55.440> like 00:04:55.629 --> 00:04:55.639 align:start position:0% so you can see most of this is for like 00:04:55.639 --> 00:04:58.469 align:start position:0% so you can see most of this is for like loading<00:04:56.479> there's<00:04:56.880> uh<00:04:57.160> some<00:04:57.440> update<00:04:58.080> which<00:04:58.199> is 00:04:58.469 --> 00:04:58.479 align:start position:0% loading there's uh some update which is 00:04:58.479 --> 00:05:00.310 align:start position:0% loading there's uh some update which is where<00:04:58.600> you're<00:04:58.759> updating<00:04:59.160> the<00:04:59.320> text 00:05:00.310 --> 00:05:00.320 align:start position:0% where you're updating the text 00:05:00.320 --> 00:05:03.189 align:start position:0% where you're updating the text we're<00:05:00.560> actually<00:05:00.759> going<00:05:00.880> to<00:05:01.120> look<00:05:01.440> and<00:05:02.199> see 00:05:03.189 --> 00:05:03.199 align:start position:0% we're actually going to look and see 00:05:03.199 --> 00:05:08.909 align:start position:0% we're actually going to look and see where<00:05:04.120> this<00:05:04.600> is<00:05:05.440> uh<00:05:06.000> is<00:05:06.440> working<00:05:07.440> so<00:05:08.240> if<00:05:08.520> we 00:05:08.909 --> 00:05:08.919 align:start position:0% where this is uh is working so if we 00:05:08.919 --> 00:05:12.510 align:start position:0% where this is uh is working so if we continue<00:05:09.440> down<00:05:10.240> and<00:05:10.520> we<00:05:10.639> are<00:05:10.880> looking<00:05:11.400> at<00:05:12.240> the 00:05:12.510 --> 00:05:12.520 align:start position:0% continue down and we are looking at the 00:05:12.520 --> 00:05:14.150 align:start position:0% continue down and we are looking at the recorder<00:05:13.080> this<00:05:13.160> is<00:05:13.320> all<00:05:13.479> the<00:05:13.680> information 00:05:14.150 --> 00:05:14.160 align:start position:0% recorder this is all the information 00:05:14.160 --> 00:05:15.950 align:start position:0% recorder this is all the information about<00:05:14.520> starting<00:05:14.880> and<00:05:15.039> stopping<00:05:15.360> the 00:05:15.950 --> 00:05:15.960 align:start position:0% about starting and stopping the 00:05:15.960 --> 00:05:19.629 align:start position:0% about starting and stopping the recording<00:05:16.960> and<00:05:17.199> then<00:05:17.479> what's<00:05:17.759> Happening<00:05:18.639> Here 00:05:19.629 --> 00:05:19.639 align:start position:0% recording and then what's Happening Here 00:05:19.639 --> 00:05:23.710 align:start position:0% recording and then what's Happening Here is<00:05:20.240> we<00:05:20.479> are<00:05:20.880> actually<00:05:21.319> looking<00:05:22.240> at<00:05:23.240> how<00:05:23.479> this 00:05:23.710 --> 00:05:23.720 align:start position:0% is we are actually looking at how this 00:05:23.720 --> 00:05:27.469 align:start position:0% is we are actually looking at how this information<00:05:24.240> is<00:05:24.440> being<00:05:24.919> sent<00:05:25.919> with<00:05:26.160> this<00:05:26.479> code 00:05:27.469 --> 00:05:27.479 align:start position:0% information is being sent with this code 00:05:27.479 --> 00:05:28.629 align:start position:0% information is being sent with this code so<00:05:27.800> right 00:05:28.629 --> 00:05:28.639 align:start position:0% so right 00:05:28.639 --> 00:05:31.469 align:start position:0% so right here<00:05:29.720> it's<00:05:29.880> saying<00:05:30.560> as<00:05:30.720> the<00:05:30.919> recording<00:05:31.319> is 00:05:31.469 --> 00:05:31.479 align:start position:0% here it's saying as the recording is 00:05:31.479 --> 00:05:35.270 align:start position:0% here it's saying as the recording is coming<00:05:31.800> in<00:05:32.680> we're<00:05:32.840> going<00:05:32.960> to<00:05:33.199> take<00:05:33.479> a<00:05:34.039> blob<00:05:35.039> and 00:05:35.270 --> 00:05:35.280 align:start position:0% coming in we're going to take a blob and 00:05:35.280 --> 00:05:38.150 align:start position:0% coming in we're going to take a blob and chunk<00:05:35.840> it<00:05:36.840> and<00:05:37.000> so<00:05:37.479> then<00:05:37.680> we're<00:05:37.800> going<00:05:37.919> to<00:05:38.000> make 00:05:38.150 --> 00:05:38.160 align:start position:0% chunk it and so then we're going to make 00:05:38.160 --> 00:05:41.950 align:start position:0% chunk it and so then we're going to make a<00:05:38.319> file<00:05:38.600> reader<00:05:39.400> and<00:05:39.639> read<00:05:40.440> those<00:05:41.440> and<00:05:41.600> then 00:05:41.950 --> 00:05:41.960 align:start position:0% a file reader and read those and then 00:05:41.960 --> 00:05:46.230 align:start position:0% a file reader and read those and then send<00:05:42.520> that<00:05:42.840> on<00:05:43.680> when<00:05:43.880> the<00:05:44.080> file<00:05:44.360> is<00:05:44.560> being 00:05:46.230 --> 00:05:46.240 align:start position:0% send that on when the file is being 00:05:46.240 --> 00:05:49.710 align:start position:0% send that on when the file is being read<00:05:47.240> get<00:05:47.520> that<00:05:47.880> bit<00:05:48.280> information<00:05:48.840> that's 00:05:49.710 --> 00:05:49.720 align:start position:0% read get that bit information that's 00:05:49.720 --> 00:05:53.670 align:start position:0% read get that bit information that's decoded<00:05:50.720> slice<00:05:51.199> it<00:05:52.039> and<00:05:52.160> then<00:05:52.479> send<00:05:53.039> those 00:05:53.670 --> 00:05:53.680 align:start position:0% decoded slice it and then send those 00:05:53.680 --> 00:05:57.390 align:start position:0% decoded slice it and then send those slices<00:05:54.440> over<00:05:54.840> to<00:05:55.840> our<00:05:56.520> worker<00:05:57.000> so<00:05:57.160> we're 00:05:57.390 --> 00:05:57.400 align:start position:0% slices over to our worker so we're 00:05:57.400 --> 00:05:59.790 align:start position:0% slices over to our worker so we're posting<00:05:57.759> the<00:05:57.960> message<00:05:58.319> to<00:05:58.639> generate<00:05:59.639> our 00:05:59.790 --> 00:05:59.800 align:start position:0% posting the message to generate our 00:05:59.800 --> 00:06:02.950 align:start position:0% posting the message to generate our transcription<00:06:00.800> on<00:06:01.000> the<00:06:01.319> Fly<00:06:02.319> then<00:06:02.560> this<00:06:02.680> is 00:06:02.950 --> 00:06:02.960 align:start position:0% transcription on the Fly then this is 00:06:02.960 --> 00:06:06.029 align:start position:0% transcription on the Fly then this is just<00:06:03.240> our<00:06:04.039> uh<00:06:04.319> our<00:06:04.600> HTML<00:06:05.600> that<00:06:05.720> we're<00:06:05.840> going<00:06:05.960> to 00:06:06.029 --> 00:06:06.039 align:start position:0% just our uh our HTML that we're going to 00:06:06.039 --> 00:06:07.110 align:start position:0% just our uh our HTML that we're going to be<00:06:06.160> pulling 00:06:07.110 --> 00:06:07.120 align:start position:0% be pulling 00:06:07.120 --> 00:06:10.950 align:start position:0% be pulling in<00:06:08.120> so<00:06:08.919> what<00:06:09.039> we'll<00:06:09.319> do<00:06:09.880> is<00:06:10.280> we'll<00:06:10.520> jump<00:06:10.800> over 00:06:10.950 --> 00:06:10.960 align:start position:0% in so what we'll do is we'll jump over 00:06:10.960 --> 00:06:13.029 align:start position:0% in so what we'll do is we'll jump over to<00:06:11.080> the<00:06:11.199> worker<00:06:11.800> and<00:06:11.960> then<00:06:12.120> we'll<00:06:12.319> take<00:06:12.479> a<00:06:12.680> look 00:06:13.029 --> 00:06:13.039 align:start position:0% to the worker and then we'll take a look 00:06:13.039 --> 00:06:15.589 align:start position:0% to the worker and then we'll take a look at<00:06:13.319> how<00:06:13.520> this<00:06:13.639> is<00:06:13.880> actually<00:06:14.280> functioning<00:06:15.280> real 00:06:15.589 --> 00:06:15.599 align:start position:0% at how this is actually functioning real 00:06:15.599 --> 00:06:17.189 align:start position:0% at how this is actually functioning real quick<00:06:15.800> everyone<00:06:16.199> if<00:06:16.280> you<00:06:16.400> haven't<00:06:16.680> already 00:06:17.189 --> 00:06:17.199 align:start position:0% quick everyone if you haven't already 00:06:17.199 --> 00:06:19.110 align:start position:0% quick everyone if you haven't already please<00:06:17.440> remember<00:06:17.720> to<00:06:17.919> like<00:06:18.080> And<00:06:18.280> subscribe<00:06:18.960> it 00:06:19.110 --> 00:06:19.120 align:start position:0% please remember to like And subscribe it 00:06:19.120 --> 00:06:21.309 align:start position:0% please remember to like And subscribe it helps<00:06:19.360> more<00:06:19.599> than<00:06:19.720> you<00:06:19.880> know<00:06:20.720> if<00:06:20.840> you<00:06:20.960> have<00:06:21.120> any 00:06:21.309 --> 00:06:21.319 align:start position:0% helps more than you know if you have any 00:06:21.319 --> 00:06:22.870 align:start position:0% helps more than you know if you have any questions<00:06:21.960> please<00:06:22.199> leave<00:06:22.400> them<00:06:22.560> in<00:06:22.680> the 00:06:22.870 --> 00:06:22.880 align:start position:0% questions please leave them in the 00:06:22.880 --> 00:06:24.830 align:start position:0% questions please leave them in the comments<00:06:23.319> and<00:06:23.479> with<00:06:23.720> that<00:06:24.039> let's<00:06:24.240> get<00:06:24.400> back<00:06:24.560> to 00:06:24.830 --> 00:06:24.840 align:start position:0% comments and with that let's get back to 00:06:24.840 --> 00:06:28.110 align:start position:0% comments and with that let's get back to it<00:06:25.840> all<00:06:26.000> right<00:06:26.360> so<00:06:27.120> now<00:06:27.319> that<00:06:27.440> we're<00:06:27.639> in<00:06:27.840> our 00:06:28.110 --> 00:06:28.120 align:start position:0% it all right so now that we're in our 00:06:28.120 --> 00:06:30.150 align:start position:0% it all right so now that we're in our worker<00:06:28.599> file<00:06:28.960> we're<00:06:29.120> going<00:06:29.199> to<00:06:29.319> start 00:06:30.150 --> 00:06:30.160 align:start position:0% worker file we're going to start 00:06:30.160 --> 00:06:33.390 align:start position:0% worker file we're going to start looking<00:06:30.520> at<00:06:30.880> how<00:06:31.199> this<00:06:32.080> actually<00:06:32.440> functions 00:06:33.390 --> 00:06:33.400 align:start position:0% looking at how this actually functions 00:06:33.400 --> 00:06:35.029 align:start position:0% looking at how this actually functions first<00:06:33.639> thing<00:06:33.800> is<00:06:33.960> we're<00:06:34.120> loading<00:06:34.479> in 00:06:35.029 --> 00:06:35.039 align:start position:0% first thing is we're loading in 00:06:35.039 --> 00:06:36.950 align:start position:0% first thing is we're loading in Transformers<00:06:36.039> we're<00:06:36.160> going<00:06:36.280> to<00:06:36.400> pull<00:06:36.599> in<00:06:36.759> our 00:06:36.950 --> 00:06:36.960 align:start position:0% Transformers we're going to pull in our 00:06:36.960 --> 00:06:38.110 align:start position:0% Transformers we're going to pull in our Auto 00:06:38.110 --> 00:06:38.120 align:start position:0% Auto 00:06:38.120 --> 00:06:42.510 align:start position:0% Auto tokenizer<00:06:39.120> our<00:06:40.039> Auto<00:06:40.720> processor<00:06:41.560> and<00:06:41.840> then<00:06:42.360> uh 00:06:42.510 --> 00:06:42.520 align:start position:0% tokenizer our Auto processor and then uh 00:06:42.520 --> 00:06:45.350 align:start position:0% tokenizer our Auto processor and then uh whisper<00:06:42.960> and<00:06:43.160> text<00:06:43.440> stream<00:06:44.240> as<00:06:44.360> well<00:06:44.479> as<00:06:44.599> full 00:06:45.350 --> 00:06:45.360 align:start position:0% whisper and text stream as well as full 00:06:45.360 --> 00:06:48.990 align:start position:0% whisper and text stream as well as full so<00:06:45.560> if<00:06:45.680> we<00:06:45.880> look<00:06:46.720> at<00:06:47.720> what<00:06:48.199> we're<00:06:48.440> first<00:06:48.720> doing 00:06:48.990 --> 00:06:49.000 align:start position:0% so if we look at what we're first doing 00:06:49.000 --> 00:06:51.749 align:start position:0% so if we look at what we're first doing we<00:06:49.120> have<00:06:49.280> this<00:06:49.520> class<00:06:50.280> which<00:06:50.400> is<00:06:50.520> our<00:06:50.800> Pipeline 00:06:51.749 --> 00:06:51.759 align:start position:0% we have this class which is our Pipeline 00:06:51.759 --> 00:06:53.589 align:start position:0% we have this class which is our Pipeline and<00:06:51.880> then<00:06:52.000> we're<00:06:52.280> actually<00:06:52.639> using<00:06:53.240> our 00:06:53.589 --> 00:06:53.599 align:start position:0% and then we're actually using our 00:06:53.599 --> 00:06:55.270 align:start position:0% and then we're actually using our instance<00:06:54.080> where<00:06:54.199> we're<00:06:54.440> getting<00:06:54.759> our<00:06:54.919> model 00:06:55.270 --> 00:06:55.280 align:start position:0% instance where we're getting our model 00:06:55.280 --> 00:06:57.469 align:start position:0% instance where we're getting our model so<00:06:55.400> we're<00:06:55.520> saying<00:06:55.759> this<00:06:55.879> is<00:06:55.960> our<00:06:56.120> model<00:06:56.440> ID<00:06:57.360> we 00:06:57.469 --> 00:06:57.479 align:start position:0% so we're saying this is our model ID we 00:06:57.479 --> 00:06:59.909 align:start position:0% so we're saying this is our model ID we have<00:06:57.599> our<00:06:57.720> tokenizer<00:06:58.360> our<00:06:58.639> processor<00:06:59.599> we're 00:06:59.909 --> 00:06:59.919 align:start position:0% have our tokenizer our processor we're 00:06:59.919 --> 00:07:03.230 align:start position:0% have our tokenizer our processor we're actually<00:07:00.919> getting<00:07:01.479> the<00:07:01.639> model<00:07:02.120> based<00:07:02.479> on<00:07:02.879> our 00:07:03.230 --> 00:07:03.240 align:start position:0% actually getting the model based on our 00:07:03.240 --> 00:07:06.110 align:start position:0% actually getting the model based on our ID<00:07:03.879> at<00:07:04.080> this<00:07:04.479> point<00:07:05.479> uh<00:07:05.599> we're<00:07:05.720> telling<00:07:06.000> it 00:07:06.110 --> 00:07:06.120 align:start position:0% ID at this point uh we're telling it 00:07:06.120 --> 00:07:08.550 align:start position:0% ID at this point uh we're telling it what<00:07:06.240> our<00:07:06.360> dtype<00:07:06.800> is<00:07:07.440> and<00:07:07.720> then<00:07:08.039> specifically 00:07:08.550 --> 00:07:08.560 align:start position:0% what our dtype is and then specifically 00:07:08.560 --> 00:07:10.990 align:start position:0% what our dtype is and then specifically we're<00:07:08.840> using<00:07:09.840> device<00:07:10.240> web 00:07:10.990 --> 00:07:11.000 align:start position:0% we're using device web 00:07:11.000 --> 00:07:14.270 align:start position:0% we're using device web GPU<00:07:12.000> and<00:07:12.199> once<00:07:12.440> all<00:07:12.560> of<00:07:12.720> these<00:07:12.879> have<00:07:13.280> processed 00:07:14.270 --> 00:07:14.280 align:start position:0% GPU and once all of these have processed 00:07:14.280 --> 00:07:17.390 align:start position:0% GPU and once all of these have processed uh<00:07:14.560> then<00:07:14.840> our<00:07:15.680> git<00:07:15.919> instance<00:07:16.319> has<00:07:16.479> been 00:07:17.390 --> 00:07:17.400 align:start position:0% uh then our git instance has been 00:07:17.400 --> 00:07:19.550 align:start position:0% uh then our git instance has been established<00:07:18.400> if<00:07:18.520> we<00:07:18.680> scroll<00:07:19.039> down<00:07:19.199> to<00:07:19.400> the 00:07:19.550 --> 00:07:19.560 align:start position:0% established if we scroll down to the 00:07:19.560 --> 00:07:21.070 align:start position:0% established if we scroll down to the bottom<00:07:19.919> we<00:07:20.039> can<00:07:20.199> kind<00:07:20.280> of<00:07:20.440> look<00:07:20.599> at<00:07:20.800> like<00:07:20.960> some 00:07:21.070 --> 00:07:21.080 align:start position:0% bottom we can kind of look at like some 00:07:21.080 --> 00:07:24.150 align:start position:0% bottom we can kind of look at like some of<00:07:21.199> the<00:07:21.280> loader<00:07:21.759> functions<00:07:22.599> so<00:07:23.039> you<00:07:23.280> can<00:07:23.680> see 00:07:24.150 --> 00:07:24.160 align:start position:0% of the loader functions so you can see 00:07:24.160 --> 00:07:26.670 align:start position:0% of the loader functions so you can see here<00:07:25.000> there's<00:07:25.280> the<00:07:25.400> load<00:07:25.840> this<00:07:25.960> happens<00:07:26.319> like 00:07:26.670 --> 00:07:26.680 align:start position:0% here there's the load this happens like 00:07:26.680 --> 00:07:28.189 align:start position:0% here there's the load this happens like where<00:07:26.800> we're<00:07:27.039> actually<00:07:27.479> posting<00:07:27.960> back 00:07:28.189 --> 00:07:28.199 align:start position:0% where we're actually posting back 00:07:28.199 --> 00:07:30.869 align:start position:0% where we're actually posting back messages<00:07:28.720> to<00:07:28.960> actually<00:07:29.280> see<00:07:29.560> see<00:07:29.879> the 00:07:30.869 --> 00:07:30.879 align:start position:0% messages to actually see see the 00:07:30.879 --> 00:07:32.830 align:start position:0% messages to actually see see the progress<00:07:31.280> bar<00:07:31.720> things<00:07:31.960> like<00:07:32.160> that<00:07:32.319> we're 00:07:32.830 --> 00:07:32.840 align:start position:0% progress bar things like that we're 00:07:32.840 --> 00:07:35.710 align:start position:0% progress bar things like that we're establishing<00:07:33.400> some<00:07:33.919> events<00:07:34.680> based<00:07:34.879> on<00:07:35.000> our 00:07:35.710 --> 00:07:35.720 align:start position:0% establishing some events based on our 00:07:35.720 --> 00:07:40.430 align:start position:0% establishing some events based on our message<00:07:36.720> and<00:07:37.080> then<00:07:38.080> once<00:07:38.440> the<00:07:38.919> the<00:07:39.240> browser<00:07:40.240> uh 00:07:40.430 --> 00:07:40.440 align:start position:0% message and then once the the browser uh 00:07:40.440 --> 00:07:42.629 align:start position:0% message and then once the the browser uh or<00:07:40.680> once<00:07:40.840> the<00:07:40.960> model<00:07:41.240> is<00:07:41.440> actually<00:07:41.680> loaded 00:07:42.629 --> 00:07:42.639 align:start position:0% or once the model is actually loaded 00:07:42.639 --> 00:07:44.909 align:start position:0% or once the model is actually loaded we're<00:07:42.800> going<00:07:42.879> to<00:07:43.000> be<00:07:43.120> looking<00:07:43.440> for<00:07:44.000> this 00:07:44.909 --> 00:07:44.919 align:start position:0% we're going to be looking for this 00:07:44.919 --> 00:07:48.909 align:start position:0% we're going to be looking for this generate<00:07:46.000> function<00:07:47.000> this<00:07:47.400> function<00:07:48.400> is<00:07:48.639> what 00:07:48.909 --> 00:07:48.919 align:start position:0% generate function this function is what 00:07:48.919 --> 00:07:51.149 align:start position:0% generate function this function is what really<00:07:49.240> is<00:07:49.400> going<00:07:49.560> to<00:07:49.680> be<00:07:49.919> taking<00:07:50.240> the<00:07:50.440> audio 00:07:51.149 --> 00:07:51.159 align:start position:0% really is going to be taking the audio 00:07:51.159 --> 00:07:53.749 align:start position:0% really is going to be taking the audio and<00:07:51.360> taking<00:07:51.680> the<00:07:52.000> language<00:07:53.000> and<00:07:53.199> then 00:07:53.749 --> 00:07:53.759 align:start position:0% and taking the language and then 00:07:53.759 --> 00:07:56.869 align:start position:0% and taking the language and then actually<00:07:54.560> processing<00:07:55.199> it<00:07:56.199> so<00:07:56.560> the<00:07:56.680> first 00:07:56.869 --> 00:07:56.879 align:start position:0% actually processing it so the first 00:07:56.879 --> 00:07:58.670 align:start position:0% actually processing it so the first thing<00:07:57.039> we'll<00:07:57.240> be<00:07:57.400> doing<00:07:57.599> is<00:07:57.759> saying<00:07:58.039> is<00:07:58.199> if<00:07:58.479> if 00:07:58.670 --> 00:07:58.680 align:start position:0% thing we'll be doing is saying is if if 00:07:58.680 --> 00:08:00.110 align:start position:0% thing we'll be doing is saying is if if processing<00:07:59.280> return 00:08:00.110 --> 00:08:00.120 align:start position:0% processing return 00:08:00.120 --> 00:08:02.270 align:start position:0% processing return if<00:08:00.360> it<00:08:00.639> is<00:08:00.919> not<00:08:01.199> processing<00:08:01.840> then<00:08:02.000> go<00:08:02.120> ahead 00:08:02.270 --> 00:08:02.280 align:start position:0% if it is not processing then go ahead 00:08:02.280 --> 00:08:04.629 align:start position:0% if it is not processing then go ahead and<00:08:02.400> set<00:08:02.639> that<00:08:02.840> processing<00:08:03.479> to<00:08:04.000> True 00:08:04.629 --> 00:08:04.639 align:start position:0% and set that processing to True 00:08:04.639 --> 00:08:06.790 align:start position:0% and set that processing to True maintaining<00:08:05.280> State<00:08:06.280> we're<00:08:06.479> actually<00:08:06.720> going 00:08:06.790 --> 00:08:06.800 align:start position:0% maintaining State we're actually going 00:08:06.800 --> 00:08:08.629 align:start position:0% maintaining State we're actually going to<00:08:06.919> send<00:08:07.120> a<00:08:07.280> message<00:08:07.759> back<00:08:08.039> to<00:08:08.199> say<00:08:08.360> that<00:08:08.479> we're 00:08:08.629 --> 00:08:08.639 align:start position:0% to send a message back to say that we're 00:08:08.639 --> 00:08:10.510 align:start position:0% to send a message back to say that we're trans<00:08:09.280> that<00:08:09.400> the<00:08:09.479> thread<00:08:09.720> is<00:08:09.879> starting<00:08:10.360> so 00:08:10.510 --> 00:08:10.520 align:start position:0% trans that the thread is starting so 00:08:10.520 --> 00:08:12.990 align:start position:0% trans that the thread is starting so we're<00:08:10.639> saying<00:08:10.919> start<00:08:11.560> as<00:08:11.720> our<00:08:11.919> status<00:08:12.919> and 00:08:12.990 --> 00:08:13.000 align:start position:0% we're saying start as our status and 00:08:13.000 --> 00:08:14.189 align:start position:0% we're saying start as our status and then<00:08:13.120> we're<00:08:13.319> actually<00:08:13.560> pulling<00:08:13.840> in<00:08:13.960> our 00:08:14.189 --> 00:08:14.199 align:start position:0% then we're actually pulling in our 00:08:14.199 --> 00:08:16.070 align:start position:0% then we're actually pulling in our instance<00:08:14.759> so<00:08:15.159> again<00:08:15.360> where<00:08:15.560> we<00:08:15.720> set<00:08:15.919> our 00:08:16.070 --> 00:08:16.080 align:start position:0% instance so again where we set our 00:08:16.080 --> 00:08:18.029 align:start position:0% instance so again where we set our tokenizer<00:08:16.840> and<00:08:16.960> our<00:08:17.159> processor<00:08:17.560> and<00:08:17.720> model 00:08:18.029 --> 00:08:18.039 align:start position:0% tokenizer and our processor and model 00:08:18.039 --> 00:08:21.830 align:start position:0% tokenizer and our processor and model we're<00:08:18.240> actually<00:08:18.440> pulling<00:08:18.840> that<00:08:19.199> from<00:08:19.919> our<00:08:20.919> um 00:08:21.830 --> 00:08:21.840 align:start position:0% we're actually pulling that from our um 00:08:21.840 --> 00:08:25.510 align:start position:0% we're actually pulling that from our um instance<00:08:22.840> and<00:08:22.960> we're<00:08:23.120> starting<00:08:23.599> to<00:08:24.520> actually 00:08:25.510 --> 00:08:25.520 align:start position:0% instance and we're starting to actually 00:08:25.520 --> 00:08:27.070 align:start position:0% instance and we're starting to actually process<00:08:25.919> so<00:08:26.039> we<00:08:26.159> have<00:08:26.240> our<00:08:26.440> call<00:08:26.680> back 00:08:27.070 --> 00:08:27.080 align:start position:0% process so we have our call back 00:08:27.080 --> 00:08:29.189 align:start position:0% process so we have our call back function<00:08:28.080> which<00:08:28.199> is<00:08:28.360> going<00:08:28.479> to<00:08:28.800> give<00:08:28.919> us<00:08:29.080> the 00:08:29.189 --> 00:08:29.199 align:start position:0% function which is going to give us the 00:08:29.199 --> 00:08:30.189 align:start position:0% function which is going to give us the out 00:08:30.189 --> 00:08:30.199 align:start position:0% out 00:08:30.199 --> 00:08:35.149 align:start position:0% out output<00:08:31.199> of<00:08:31.479> our<00:08:31.759> post<00:08:32.120> message<00:08:32.599> of<00:08:33.360> update<00:08:34.360> and 00:08:35.149 --> 00:08:35.159 align:start position:0% output of our post message of update and 00:08:35.159 --> 00:08:37.310 align:start position:0% output of our post message of update and information<00:08:35.640> about<00:08:35.839> our<00:08:36.000> TPS<00:08:36.599> our<00:08:36.800> tokens<00:08:37.200> and 00:08:37.310 --> 00:08:37.320 align:start position:0% information about our TPS our tokens and 00:08:37.320 --> 00:08:40.310 align:start position:0% information about our TPS our tokens and our<00:08:37.839> actual<00:08:38.360> output<00:08:39.360> and<00:08:39.479> then<00:08:39.719> we<00:08:40.080> we<00:08:40.200> have 00:08:40.310 --> 00:08:40.320 align:start position:0% our actual output and then we we have 00:08:40.320 --> 00:08:42.870 align:start position:0% our actual output and then we we have our<00:08:40.599> streamer<00:08:41.599> and<00:08:41.800> we<00:08:42.159> this<00:08:42.279> is<00:08:42.479> where<00:08:42.640> we're 00:08:42.870 --> 00:08:42.880 align:start position:0% our streamer and we this is where we're 00:08:42.880 --> 00:08:44.829 align:start position:0% our streamer and we this is where we're actually 00:08:44.829 --> 00:08:44.839 align:start position:0% actually 00:08:44.839 --> 00:08:48.190 align:start position:0% actually processing<00:08:45.839> our<00:08:46.760> information<00:08:47.720> so<00:08:47.959> what<00:08:48.040> we're 00:08:48.190 --> 00:08:48.200 align:start position:0% processing our information so what we're 00:08:48.200 --> 00:08:51.470 align:start position:0% processing our information so what we're saying<00:08:48.800> is<00:08:49.680> our<00:08:49.920> input<00:08:50.399> we're<00:08:50.560> taking<00:08:50.800> our<00:08:51.040> AO 00:08:51.470 --> 00:08:51.480 align:start position:0% saying is our input we're taking our AO 00:08:51.480 --> 00:08:53.630 align:start position:0% saying is our input we're taking our AO audio<00:08:52.040> and<00:08:52.160> we're<00:08:52.959> uh<00:08:53.080> putting<00:08:53.320> it<00:08:53.480> through 00:08:53.630 --> 00:08:53.640 align:start position:0% audio and we're uh putting it through 00:08:53.640 --> 00:08:57.310 align:start position:0% audio and we're uh putting it through our<00:08:54.320> processor<00:08:55.320> we<00:08:55.600> then<00:08:56.279> this<00:08:56.399> is<00:08:56.560> our 00:08:57.310 --> 00:08:57.320 align:start position:0% our processor we then this is our 00:08:57.320 --> 00:08:59.430 align:start position:0% our processor we then this is our transcription<00:08:58.320> our<00:08:58.480> transcription<00:08:59.240> BAS 00:08:59.430 --> 00:08:59.440 align:start position:0% transcription our transcription BAS 00:08:59.440 --> 00:09:01.750 align:start position:0% transcription our transcription BAS based<00:08:59.600> on<00:08:59.720> our<00:08:59.839> model<00:09:00.680> and<00:09:00.839> our<00:09:01.040> generate 00:09:01.750 --> 00:09:01.760 align:start position:0% based on our model and our generate 00:09:01.760 --> 00:09:03.190 align:start position:0% based on our model and our generate we're<00:09:01.920> saying<00:09:02.200> we're<00:09:02.440> passing<00:09:02.760> our<00:09:02.920> same 00:09:03.190 --> 00:09:03.200 align:start position:0% we're saying we're passing our same 00:09:03.200 --> 00:09:05.550 align:start position:0% we're saying we're passing our same inputs<00:09:03.880> our<00:09:04.120> language<00:09:04.880> and<00:09:05.000> we're<00:09:05.240> actually 00:09:05.550 --> 00:09:05.560 align:start position:0% inputs our language and we're actually 00:09:05.560 --> 00:09:08.230 align:start position:0% inputs our language and we're actually streaming<00:09:06.079> the<00:09:06.279> events<00:09:07.120> or<00:09:07.399> streaming<00:09:07.800> the 00:09:08.230 --> 00:09:08.240 align:start position:0% streaming the events or streaming the 00:09:08.240 --> 00:09:10.710 align:start position:0% streaming the events or streaming the output<00:09:09.240> so<00:09:09.399> now<00:09:09.519> we<00:09:09.600> have<00:09:09.720> our<00:09:09.880> tokenizer<00:09:10.600> this 00:09:10.710 --> 00:09:10.720 align:start position:0% output so now we have our tokenizer this 00:09:10.720 --> 00:09:11.990 align:start position:0% output so now we have our tokenizer this gives<00:09:10.920> us<00:09:11.079> the<00:09:11.240> information<00:09:11.720> that's 00:09:11.990 --> 00:09:12.000 align:start position:0% gives us the information that's 00:09:12.000 --> 00:09:13.350 align:start position:0% gives us the information that's displayed<00:09:12.399> in<00:09:12.519> the<00:09:12.640> bottom<00:09:12.920> right<00:09:13.079> of<00:09:13.240> how 00:09:13.350 --> 00:09:13.360 align:start position:0% displayed in the bottom right of how 00:09:13.360 --> 00:09:15.509 align:start position:0% displayed in the bottom right of how many<00:09:13.519> tokens<00:09:13.839> we're<00:09:14.079> actually<00:09:14.399> using<00:09:15.399> and 00:09:15.509 --> 00:09:15.519 align:start position:0% many tokens we're actually using and 00:09:15.519 --> 00:09:19.509 align:start position:0% many tokens we're actually using and then<00:09:15.640> we're<00:09:16.000> posting<00:09:16.640> back<00:09:17.000> that<00:09:17.640> chunk<00:09:18.640> of 00:09:19.509 --> 00:09:19.519 align:start position:0% then we're posting back that chunk of 00:09:19.519 --> 00:09:23.069 align:start position:0% then we're posting back that chunk of text<00:09:20.519> as<00:09:20.760> it<00:09:20.920> is<00:09:21.200> complete<00:09:22.040> and<00:09:22.160> so<00:09:22.480> remember 00:09:23.069 --> 00:09:23.079 align:start position:0% text as it is complete and so remember 00:09:23.079 --> 00:09:24.790 align:start position:0% text as it is complete and so remember if<00:09:23.240> we<00:09:23.440> are<00:09:23.640> looking<00:09:23.920> at<00:09:24.160> what<00:09:24.320> these<00:09:24.519> post 00:09:24.790 --> 00:09:24.800 align:start position:0% if we are looking at what these post 00:09:24.800 --> 00:09:27.509 align:start position:0% if we are looking at what these post messages<00:09:25.279> are<00:09:26.200> we're<00:09:26.399> coming<00:09:26.760> back<00:09:26.959> here<00:09:27.240> and 00:09:27.509 --> 00:09:27.519 align:start position:0% messages are we're coming back here and 00:09:27.519 --> 00:09:32.150 align:start position:0% messages are we're coming back here and that<00:09:28.120> is<00:09:29.120> the<00:09:29.600> information<00:09:30.600> that<00:09:30.800> is<00:09:31.399> being<00:09:31.720> on 00:09:32.150 --> 00:09:32.160 align:start position:0% that is the information that is being on 00:09:32.160 --> 00:09:35.389 align:start position:0% that is the information that is being on on<00:09:32.480> message<00:09:33.120> received<00:09:34.079> so<00:09:34.240> if<00:09:34.360> we<00:09:34.560> look<00:09:34.920> down 00:09:35.389 --> 00:09:35.399 align:start position:0% on message received so if we look down 00:09:35.399 --> 00:09:36.829 align:start position:0% on message received so if we look down to 00:09:36.829 --> 00:09:36.839 align:start position:0% to 00:09:36.839 --> 00:09:39.230 align:start position:0% to update<00:09:37.839> we're<00:09:38.000> seeing<00:09:38.399> that<00:09:38.720> we're<00:09:38.920> setting 00:09:39.230 --> 00:09:39.240 align:start position:0% update we're seeing that we're setting 00:09:39.240 --> 00:09:43.870 align:start position:0% update we're seeing that we're setting our<00:09:39.440> TPS<00:09:40.120> here<00:09:40.800> as<00:09:41.000> well<00:09:41.880> as<00:09:42.880> uh<00:09:43.120> our<00:09:43.399> message 00:09:43.870 --> 00:09:43.880 align:start position:0% our TPS here as well as uh our message 00:09:43.880 --> 00:09:46.269 align:start position:0% our TPS here as well as uh our message so<00:09:44.079> our<00:09:44.279> on<00:09:44.600> message<00:09:45.200> right<00:09:45.680> here<00:09:46.040> this<00:09:46.120> is 00:09:46.269 --> 00:09:46.279 align:start position:0% so our on message right here this is 00:09:46.279 --> 00:09:48.470 align:start position:0% so our on message right here this is where<00:09:46.480> we're<00:09:46.880> being<00:09:47.880> sending<00:09:48.320> the 00:09:48.470 --> 00:09:48.480 align:start position:0% where we're being sending the 00:09:48.480 --> 00:09:50.030 align:start position:0% where we're being sending the information<00:09:49.000> back<00:09:49.240> and<00:09:49.360> then<00:09:49.600> that's<00:09:49.839> how 00:09:50.030 --> 00:09:50.040 align:start position:0% information back and then that's how 00:09:50.040 --> 00:09:53.110 align:start position:0% information back and then that's how we're<00:09:50.360> actually<00:09:51.240> passing<00:09:52.240> information<00:09:52.880> down 00:09:53.110 --> 00:09:53.120 align:start position:0% we're actually passing information down 00:09:53.120 --> 00:09:55.470 align:start position:0% we're actually passing information down here<00:09:53.480> so<00:09:53.800> this<00:09:53.880> is<00:09:54.040> where<00:09:54.160> our 00:09:55.470 --> 00:09:55.480 align:start position:0% here so this is where our 00:09:55.480 --> 00:10:00.550 align:start position:0% here so this is where our TPS<00:09:56.480> is<00:09:57.079> and<00:09:57.720> then<00:09:58.720> uh 00:10:00.550 --> 00:10:00.560 align:start position:0% TPS is and then uh 00:10:00.560 --> 00:10:02.790 align:start position:0% TPS is and then uh the<00:10:01.200> this<00:10:01.519> the<00:10:01.640> rest<00:10:01.800> of<00:10:01.959> the<00:10:02.120> progress<00:10:02.440> bar<00:10:02.680> in 00:10:02.790 --> 00:10:02.800 align:start position:0% the this the rest of the progress bar in 00:10:02.800 --> 00:10:05.069 align:start position:0% the this the rest of the progress bar in the<00:10:02.959> audio<00:10:03.640> I'm<00:10:03.760> looking<00:10:04.040> for 00:10:05.069 --> 00:10:05.079 align:start position:0% the audio I'm looking for 00:10:05.079 --> 00:10:07.430 align:start position:0% the audio I'm looking for the 00:10:07.430 --> 00:10:07.440 align:start position:0% the 00:10:07.440 --> 00:10:10.550 align:start position:0% the actual<00:10:08.440> uh<00:10:09.360> information<00:10:09.800> around<00:10:10.040> the<00:10:10.160> text<00:10:10.440> oh 00:10:10.550 --> 00:10:10.560 align:start position:0% actual uh information around the text oh 00:10:10.560 --> 00:10:12.750 align:start position:0% actual uh information around the text oh it's<00:10:10.720> right<00:10:10.959> here<00:10:11.519> so<00:10:11.839> on<00:10:12.160> ready<00:10:12.519> we're 00:10:12.750 --> 00:10:12.760 align:start position:0% it's right here so on ready we're 00:10:12.760 --> 00:10:14.389 align:start position:0% it's right here so on ready we're passing<00:10:13.000> the<00:10:13.160> information<00:10:13.560> of<00:10:13.959> the<00:10:14.120> text 00:10:14.389 --> 00:10:14.399 align:start position:0% passing the information of the text 00:10:14.399 --> 00:10:15.630 align:start position:0% passing the information of the text that's<00:10:14.600> being 00:10:15.630 --> 00:10:15.640 align:start position:0% that's being 00:10:15.640 --> 00:10:18.030 align:start position:0% that's being updated<00:10:16.640> and<00:10:16.839> that's<00:10:17.040> how<00:10:17.200> this<00:10:17.360> works<00:10:17.720> is<00:10:17.880> we 00:10:18.030 --> 00:10:18.040 align:start position:0% updated and that's how this works is we 00:10:18.040 --> 00:10:20.110 align:start position:0% updated and that's how this works is we basically<00:10:18.399> are<00:10:18.600> taking<00:10:18.920> this<00:10:19.120> information 00:10:20.110 --> 00:10:20.120 align:start position:0% basically are taking this information 00:10:20.120 --> 00:10:22.230 align:start position:0% basically are taking this information from<00:10:20.519> after<00:10:20.959> after<00:10:21.160> it<00:10:21.399> passes<00:10:21.880> passes 00:10:22.230 --> 00:10:22.240 align:start position:0% from after after it passes passes 00:10:22.240 --> 00:10:24.910 align:start position:0% from after after it passes passes through<00:10:22.440> the<00:10:22.560> model<00:10:23.480> and<00:10:23.600> then<00:10:24.360> right<00:10:24.519> here<00:10:24.720> so 00:10:24.910 --> 00:10:24.920 align:start position:0% through the model and then right here so 00:10:24.920 --> 00:10:27.750 align:start position:0% through the model and then right here so being<00:10:25.120> generated<00:10:25.600> by<00:10:25.720> the<00:10:25.839> model<00:10:26.640> and<00:10:26.839> then 00:10:27.750 --> 00:10:27.760 align:start position:0% being generated by the model and then 00:10:27.760 --> 00:10:29.910 align:start position:0% being generated by the model and then posting<00:10:28.240> that<00:10:28.440> information<00:10:29.040> back 00:10:29.910 --> 00:10:29.920 align:start position:0% posting that information back 00:10:29.920 --> 00:10:33.870 align:start position:0% posting that information back so<00:10:30.200> it's<00:10:30.640> processing<00:10:31.120> the<00:10:31.240> auto<00:10:31.600> chunk<00:10:32.600> it<00:10:32.880> is 00:10:33.870 --> 00:10:33.880 align:start position:0% so it's processing the auto chunk it is 00:10:33.880 --> 00:10:36.949 align:start position:0% so it's processing the auto chunk it is audio<00:10:34.240> chunk<00:10:34.560> and<00:10:34.720> it's<00:10:35.519> uh<00:10:36.279> then<00:10:36.480> converting 00:10:36.949 --> 00:10:36.959 align:start position:0% audio chunk and it's uh then converting 00:10:36.959 --> 00:10:39.629 align:start position:0% audio chunk and it's uh then converting that<00:10:37.279> and<00:10:37.440> doing<00:10:37.639> a<00:10:38.240> transcription<00:10:39.240> on<00:10:39.399> this 00:10:39.629 --> 00:10:39.639 align:start position:0% that and doing a transcription on this 00:10:39.639 --> 00:10:41.509 align:start position:0% that and doing a transcription on this generation<00:10:40.320> then<00:10:40.440> it's<00:10:40.600> streaming<00:10:41.399> it's 00:10:41.509 --> 00:10:41.519 align:start position:0% generation then it's streaming it's 00:10:41.519 --> 00:10:43.389 align:start position:0% generation then it's streaming it's doing<00:10:41.760> the<00:10:41.880> tokenizer<00:10:42.600> and<00:10:42.760> posting<00:10:43.079> all<00:10:43.240> that 00:10:43.389 --> 00:10:43.399 align:start position:0% doing the tokenizer and posting all that 00:10:43.399 --> 00:10:46.150 align:start position:0% doing the tokenizer and posting all that information<00:10:44.399> back<00:10:45.399> all<00:10:45.560> right<00:10:45.760> everyone 00:10:46.150 --> 00:10:46.160 align:start position:0% information back all right everyone 00:10:46.160 --> 00:10:47.990 align:start position:0% information back all right everyone that's<00:10:46.320> it<00:10:46.440> for<00:10:46.600> us<00:10:46.760> today<00:10:47.240> what<00:10:47.360> we<00:10:47.519> covered 00:10:47.990 --> 00:10:48.000 align:start position:0% that's it for us today what we covered 00:10:48.000 --> 00:10:51.590 align:start position:0% that's it for us today what we covered was<00:10:48.200> using<00:10:49.040> real<00:10:49.480> time<00:10:50.440> speech<00:10:50.880> recognition 00:10:51.590 --> 00:10:51.600 align:start position:0% was using real time speech recognition 00:10:51.600 --> 00:10:54.829 align:start position:0% was using real time speech recognition in<00:10:51.760> the<00:10:52.000> browser<00:10:53.000> with<00:10:53.440> web<00:10:53.720> GPU<00:10:54.639> and 00:10:54.829 --> 00:10:54.839 align:start position:0% in the browser with web GPU and 00:10:54.839 --> 00:10:57.030 align:start position:0% in the browser with web GPU and Transformers<00:10:55.480> JS<00:10:56.279> we're<00:10:56.480> able<00:10:56.680> to<00:10:56.839> dig 00:10:57.030 --> 00:10:57.040 align:start position:0% Transformers JS we're able to dig 00:10:57.040 --> 00:10:59.389 align:start position:0% Transformers JS we're able to dig through<00:10:57.279> some<00:10:57.440> of<00:10:57.560> the<00:10:57.680> repo<00:10:58.600> and<00:10:58.920> actually 00:10:59.389 --> 00:10:59.399 align:start position:0% through some of the repo and actually 00:10:59.399 --> 00:11:01.470 align:start position:0% through some of the repo and actually get<00:10:59.519> their<00:10:59.720> demo<00:11:00.040> up<00:11:00.160> and<00:11:00.320> running<00:11:01.200> and<00:11:01.279> so 00:11:01.470 --> 00:11:01.480 align:start position:0% get their demo up and running and so 00:11:01.480 --> 00:11:04.560 align:start position:0% get their demo up and running and so with<00:11:01.639> that<00:11:01.920> happy<00:11:02.120> nerding