feat: add page speed improvements

Author: dancixx

public/rust_color.png

@@ -4,7 +4,7 @@ use leptos::prelude::*;
 use leptos_meta::*;
 use leptos_router::{
     components::{FlatRoutes, Route, Router},
-    ParamSegment, StaticSegment,
+    ParamSegment, SsrMode, StaticSegment,
 };
 
 use crate::{home, post};
@@ -196,7 +196,7 @@ pub fn App() -> impl IntoView {
                         outside_errors.insert_with_default_key(AppError::NotFound);
                         view! { <ErrorTemplate outside_errors /> }.into_view()
                     }>
-                        <Route path=StaticSegment("") view=home::Component />
+                        <Route path=StaticSegment("") view=home::Component ssr=SsrMode::InOrder />
                         <Route
                             path=(StaticSegment("post"), ParamSegment("slug"))
                             view=post::Component

public/rust_color.webp

@@ -28,8 +28,8 @@ pub fn Component() -> impl IntoView {
                 >
                     <div class="flex flex-col p-3 text-left text-white rounded-lg transition-all duration-500 cursor-pointer break-inside-avoid bg-card hover:text-[#ffef5c]">
                         <A href=format!("/post/{}", post.slug.as_ref().map_or("", |v| v))>
-                            <div class="flex flex-col gap-1 mb-4">
-                                <p class="text-base font-medium line-clamp-2">{post.title}</p>
+                            <div class="flex flex-col gap-1 mb-4 font-medium">
+                                <p class="text-base line-clamp-2">{post.title}</p>
                                 <p class="italic text-xxs">{post.summary}</p>
                             </div>
                             <div class="flex flex-row gap-3 justify-start items-center text-xxs">

src/app.rs

@@ -4,7 +4,7 @@ use leptos::prelude::*;
 pub fn Component() -> impl IntoView {
     view! {
         <div class="flex absolute inset-0 flex-col gap-1 justify-center items-center m-auto">
-            <img src="/rust_color.png" width=32 height=32 class="animate-spin" />
+            <img src="/rust_color.webp" width=32 height=32 class="animate-spin" />
             <p class="text-sm italic text-muted-foreground">Loading...</p>
         </div>
     }

src/home.rs

@@ -11,7 +11,6 @@ async fn main() {
     use leptos::logging;
     use leptos::prelude::*;
     use leptos_axum::{generate_route_list, LeptosRoutes};
-    use std::env;
     use tower_http::compression::predicate::{NotForContentType, SizeAbove};
     use tower_http::compression::{CompressionLayer, Predicate};
     use tower_http::trace::TraceLayer;