Simple QOL.

- Add ms/token on llama2.c (15ms/token on my personal machine)
- Hide `Run` buttons while models are not ready
- Add dummy `progress` while weights are downloading (I briefly looked
  at putting a real progressbar.. and nothing easy enough came up.)
This commit is contained in:
Nicolas Patry
2023-07-26 15:17:32 +02:00
parent 97990f4afc
commit 035372248e
2 changed files with 22 additions and 3 deletions

View File

@ -43,6 +43,7 @@ pub struct CurrentDecode {
pub struct App { pub struct App {
status: String, status: String,
loaded: bool,
temperature: std::rc::Rc<std::cell::RefCell<f64>>, temperature: std::rc::Rc<std::cell::RefCell<f64>>,
generated: String, generated: String,
n_tokens: usize, n_tokens: usize,
@ -81,6 +82,7 @@ impl Component for App {
generated: String::new(), generated: String::new(),
current_decode: None, current_decode: None,
worker, worker,
loaded: false,
} }
} }
@ -102,6 +104,7 @@ impl Component for App {
match msg { match msg {
Msg::SetModel(md) => { Msg::SetModel(md) => {
self.status = "weights loaded succesfully!".to_string(); self.status = "weights loaded succesfully!".to_string();
self.loaded = true;
console_log!("loaded weights"); console_log!("loaded weights");
self.worker.send(WorkerInput::ModelData(md)); self.worker.send(WorkerInput::ModelData(md));
true true
@ -186,7 +189,15 @@ impl Component for App {
</p> </p>
</div> </div>
{"temperature: "}<input type="range" min="0." max="1.2" step="0.1" value={self.temperature.borrow().to_string()} {oninput} id="temp"/> {"temperature: "}<input type="range" min="0." max="1.2" step="0.1" value={self.temperature.borrow().to_string()} {oninput} id="temp"/>
<button class="button" onclick={ctx.link().callback(move |_| Msg::Run)}> { "run" }</button>
<br/ >
{
if self.loaded{
html!(<button class="button" onclick={ctx.link().callback(move |_| Msg::Run)}> { "run" }</button>)
}else{
html! { <progress id="progress-bar" aria-label="Loading weights..."></progress> }
}
}
<br/ > <br/ >
<h3> <h3>
{&self.status} {&self.status}

View File

@ -47,6 +47,7 @@ pub struct CurrentDecode {
pub struct App { pub struct App {
status: String, status: String,
loaded: bool,
segments: Vec<Segment>, segments: Vec<Segment>,
current_decode: Option<CurrentDecode>, current_decode: Option<CurrentDecode>,
worker: Box<dyn Bridge<Worker>>, worker: Box<dyn Bridge<Worker>>,
@ -86,6 +87,7 @@ impl Component for App {
segments: vec![], segments: vec![],
current_decode: None, current_decode: None,
worker, worker,
loaded: false,
} }
} }
@ -107,6 +109,7 @@ impl Component for App {
match msg { match msg {
Msg::SetDecoder(md) => { Msg::SetDecoder(md) => {
self.status = "weights loaded succesfully!".to_string(); self.status = "weights loaded succesfully!".to_string();
self.loaded = true;
console_log!("loaded weights"); console_log!("loaded weights");
self.worker.send(WorkerInput::ModelData(md)); self.worker.send(WorkerInput::ModelData(md));
true true
@ -186,7 +189,10 @@ impl Component for App {
<tr> <tr>
<th>{name}</th> <th>{name}</th>
<th><audio controls=true src={format!("./{name}")}></audio></th> <th><audio controls=true src={format!("./{name}")}></audio></th>
<th><button class="button" onclick={ctx.link().callback(move |_| Msg::Run(i))}> { "run" }</button></th> { if self.loaded {
html!(<th><button class="button" onclick={ctx.link().callback(move |_| Msg::Run(i))}> { "run" }</button></th>)
}else{html!()}
}
</tr> </tr>
} }
}).collect::<Html>() }).collect::<Html>()
@ -197,7 +203,9 @@ impl Component for App {
{&self.status} {&self.status}
</h2> </h2>
{ {
if self.current_decode.is_some() { if !self.loaded{
html! { <progress id="progress-bar" aria-label="loading weights…"></progress> }
} else if self.current_decode.is_some() {
html! { <progress id="progress-bar" aria-label="decoding…"></progress> } html! { <progress id="progress-bar" aria-label="decoding…"></progress> }
} else { html!{ } else { html!{
<blockquote> <blockquote>