Blazor vs. React: Niyə Bu .NET Architect Nəhayət Bir Sizi Seçdi

“Blazor vs. React” hər bir .NET geliştiricinin sorğu-sual etdiyi bir sualdır. “Blazor”la C# ilə interaktiv web UI-lər yaratmanıza imkan verir. “JavaScript” əvəzində. “Blazor vs. React” hər bir .NET geliştiricinin sorğu-sual etdiyi bir şeydir. “Blazor” “JavaScript”in əvəzində C# ilə interaktiv web UI-lər yaratmanıza imkan verir.Əgər siz artıq “.NET” geliştiricisi olsanız, bu bir dil, bir ekosistem və bu çərşənbə ərzində hansı valyutadan istifadə edə biləcəyiniz haqqında çox az varlıq krizi anlamına gəlir. Blazor vs React Tartışma tabelası Bəlkə də Blazer nədir? Reaktə qarşı cinayət işi Etiket: React vs Blazor Niyə Blazor mənim üçün işləyir Blazor Evolution: .NET 8, 9 və 10 Reaksiya anlama gəldikdə “Blazzar”la başlayır Qazaxıstan: Qazaxıstan problemləri başa çatdı Son fikirlər 2009-cu ildən bu yana JavaScript-i yazıram, əvvəllər jQuery 1.3 masa kimi hiss etdim. Frameworks empires kimi yüksəldiyini və düşdüğünü gördüm. Backbone, Angular, React, və şimdi mən Signals haqqında düşünürəm? “Mənim yemək yeməyimdən daha çox idi. node_modules Mənim üçüncü yerimdə 800 MB-dan çox olan folderda, özümü soruşmağa başladım: node_modules Başqa bir yol olsaydı? “Blazor” adlanır və bunu düşünmədiyim bir dillə web aplikasiyaları yaratmağıma izin verir. is acceptable behavior. "2" + 2 = "22" Bəlkə də Blazer nədir? "Blazor" adı "Browser" və "Razor" (.NET şablon sintaxi) bir portmanteaudir və 2020-ci ildən etibarən istehsal hazırdır. Instead of writing JavaScript that runs in the browser, you write C# that either: Serverdə çalışır (Blazor Server): C# serverdə işləyir və UI güncellemələri SignalR WebSocket bağlantısı ilə real vaxtda browserə aktarılır. "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazor WebAssembly" - "Blazer" - "Blazer" - "Blazer" - İkisi (Blazor United/.NET 8+): Rendering mode per-component seçin. Server-side initial load speed, WebAssembly for offline capability. Best of both worlds. // A Blazor component. Yes, that's C# in your UI. @page "/counter"

Counter Current count: @currentCount

Click me

@code { private int currentCount = 0;

private void IncrementCount() { currentCount++; } } Xatırladaq ki, bu problemin həll olunmasının səbəbləri də var. The Case Against React (Və ya: Niyə dəyişməyə ehtiyacım var) “React” komponent bazlı UI-lər haqqında düşüncəmizi devraldı. “Virtual DOM” həqiqətən smart idi. Lakin uzun illərdir React proqramlarının yaradılmasından sonra, həyatımın seçimlərini sorğu-sual etdim. Qrupun reallaşdırılması Ekosistemlər belə tanımlanır: Bu mənim sözüm deyil, amma onu oxuduğumda ruhumda hiss etdim. “Qəbələ”nin “Fadish Churn” mövsümü Hər il yeni bir "doğru yolu" gətirir: Year What We Were Told to Use 2016 Redux. Obviously. 2018 MobX because Redux boilerplate was killing us 2020 Context API (who needs libraries?) 2021 Zustand, after Context caused re-render hell on a dashboard I built 2022 Pick one: Jotai, Recoil, Valtio, or whatever your coworker found on Hacker News 2023 Whatever survived the layoffs 2024 Server Components. State lives on the server now, apparently? 2016 Düşünürəm ki. 2018 MobX: Redux boilerplate bizi öldürdü 2020 Kontekst API (Kimə kütləvi ehtiyac var?) 2021 Xatırladaq ki, bir neçə ildir ki, bu problemlər həll olunacaq. 2022 Birini seçin: Jotai, Recoil, Valtio, ya da Hacker News-də bulduğunuz hər şey 2023 Whatever survived the layoffs 2024 Server komponentləri.Status artıq serverdə yaşayır, görünür? DEV Community-də iştirak edənlər “React-dan Vue-ya Svelte-ya Solid-a qayıtdıqdan sonra (və bir daha geri qayıtdıqdan sonra) bir o qədər də fərqli bir şəkildə aynı şeyi necə inşa edə biləcəyimi həmişə yeniləyirdim”. Mütəxəssislər bunu mükəmməl Seçki sübutları kifayətdir 2024-ci ildə yeni bir React proqnozuna başlayaraq, iki gündə yalnız alətlər seçmək üçün qaldım. Bundler? Webpack artıq "mələklər"dir, Vite standartdır, lakin Turbopack-a ehtiyacım var? State management? 3 saatdan sonra Zustand-la görüşdüm. Styling? Tailwind, amma komandamın yarısı Styled Components istəyirdi. Forms? React Hook Form, şübhəsiz ki, Formik'in daha yaxşı bir şeyə ehtiyacı olmasa. Bu, işin logikini yazmaqdan əvvəl idi. İŞİD “Ekosistem variantlarının fleksibilitesi və çeşitliliği həm bir gücü, həm də bir zayıflığı olmuşdur... Bu, decision fatigue, projekt kod bazalarında dəyişikliklər, və hansı alətlər yaygın olaraq istifadə edilir dəyişir”. Reaksiya 2025 Sağlamlıq teatrı Yes, TypeScript exists. Yes, it helps. But TypeScript is a bandage on a dynamically-typed wound. You're bolting a type system onto a language that fundamentally doesn't have one. The seams show. // TypeScript: Types are suggestions, really const user: User = JSON.parse(response); // No runtime validation! // user could be anything. TypeScript just trusts you.

// Meanwhile, in C#: var user = JsonSerializer.Deserialize (response); // Actual deserialization with type checking Yaralı Sonraki İçerikİnteraktiv.az-a istinadən xəbər verir ki, bu barədə “Qəbələ”nin “Qəbələ” jurnalına istinadən məlumat yayıb. grep -r ': any' src/ | wc -l “NPM Security Nightmare” ilə bağlı xəbərlər JavaScript topluluğunun danışmaq istəmədiyi bir şeydir: sizin Cümhuriyyət isə bir təhlükədir. node_modules September 2025: The Shai-Hulud Attack Üçüncüsü 18+ paketi Bir neçə gün ərzində Zapier, PostHog, Postman və Postman paketləri trojanized oldu. Tarixdəki ən böyük “npm” təchizatı saldırılarından biri 2.6 billion weekly downloads Bu kicker? 2025-ci ildə 25 000-dən çox GitHub repositoryunu məhv etdi.Bu versiyası “scorched earth” fallback-i içərisində idi – əgər malware kimlikləri filtre edə bilməsəydi, bu da ola bilərdi. . Qazaxıstan 2.0 destroy the victim's entire home directory Tarix bu deyil, bu da . Bu il The Greatest Hits of npm Disasters Incident Year Impact left-pad 2016 One developer unpublished an 11-line package. Babel, React, and thousands of projects broke instantly. event-stream 2018 Malicious code injected by a "helpful" new maintainer. Went undetected for 2.5 months. Targeted Bitcoin wallets. ua-parser-js 2021 8 million weekly downloads. Compromised to install cryptominers and password stealers. everything 2024 A "joke" package that depended on every npm package. DOS'd anyone who installed it. Shai-Hulud 2025 2.6B+ weekly downloads affected. AI-assisted attacks. Data destruction payloads. Sol tərəf 2016 “Babel”, “React” və 1000-dən çox layihə anında çökmüşdü. Şirkət Stream 2018 “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti “Bitcoin” şirkəti Əsas səhifə 2021 Xatırladaq ki, 8 milyon manatdan çox sərnişin və sülhdən istifadə ediləcək. Hər şey 2024 Hər bir "npm" paketi ilə bağlı olan "şak" paketi. Şeyx Şeyx 2025 2.6B+ haftalık yükləmələr zərər çəkir. AI-yə kömək olunan saldırılar. Why This Keeps Happening NPM ekosisteminin struktural problemləri var: Xatırladaq ki, bir neçə ildir ki, bu problemlər həll olunacaq. Sürücülər: phishing, yandırma və ya sosial inqilab edilə bilər ki, ödənişsiz kişilər tərəfindən qurulan kritiki infrastruktur. Npm.json.com.az xəbər verir ki, bu kodun güvenli olduğuna dair kompilasiya zamanı verifikasiya yoxdur. VVD - Hollandiyada futbolçu bu adla tanımır, orada VVD daha çox mərkəz-sağı təmsilən edən siyasi partiyanın adının qısaltması kimi bilinir - artıq sorğu-suala ehtiyacı olmayan ulduzdu. # A real npm audit from a "simple" React project found 47 vulnerabilities (12 moderate, 28 high, 7 critical) Meanwhile, in .NET Land NuGet mükəmməl deyil, lakin dramatik şəkildə daha yaxşıdır: Publika.az-a istinadən xəbər verir ki, bu barədə “Publika.az” xəbər verir. “Curated” ekosistemi: Daha az paket, lakin daha yüksək standart “Microsoft” şirkəti “trillion dollar” şirkəti, “solo” şirkəti deyil : The C# compiler catches many issues before runtime Compile-time safety Daha az bağımlılıq grafikləri: .NET-in geniş standart kütləvi daha az dış bağımlılıq anlamına gəlir When I run Xatırladaq ki, “Blazor” layihələrimdə tipik olaraq sıfır nəticə görürəm. Dünən hazırlaşdığım proqnozlara görə, səhər saatım qalmışam. dotnet list package --vulnerable npm audit Kodi özü üçün danışsın: React vs. Blazor Teoriya gözəldir. Kodu daha yaxşıdır. Bu, hər iki frameworkdə belə görünür. A Simple Counter (The “Hello World” of Frameworks) – “Hello Dünyası” React (with hooks): import { useState } from 'react';

export default function Counter() { const [count, setCount] = useState(0);

return ( Counter Current count: {count}

setCount(count + 1)}> Click me ); } Blazor: @page "/counter"

Counter Current count: @count

count++">Click me

@code { private int count = 0; } Similar line count, but notice: no imports, no hook, no setter function. Just a variable and an increment. useState İki yoldan data bağlanma Bu, ceremoniya fərqinin real olmasıdır. React: import { useState } from 'react';

export default function SearchBox() { const [query, setQuery] = useState(''); const [results, setResults] = useState([]);

const handleChange = (e) => { setQuery(e.target.value); };

return ( You typed: {query}

); } Blazor: You typed: @query

@code { private string query = ""; } handles both directions. No handler, no , no setter function. The binding just works. @bind onChange e.target.value Form Handling with Validation Burda işlər pisləşir. validasiya ilə istifadəçi kayıt forması. React (with React Hook Form + Zod - the "modern" approach): import { useForm } from 'react-hook-form'; import { zodResolver } from '@hookform/resolvers/zod'; import { z } from 'zod';

const schema = z.object({ email: z.string().email('Invalid email'), password: z.string().min(8, 'Password must be at least 8 characters'), confirmPassword: z.string() }).refine(data => data.password === data.confirmPassword, { message: "Passwords don't match", path: ['confirmPassword'] });

export default function RegisterForm() { const { register, handleSubmit, formState: { errors, isSubmitting } } = useForm({ resolver: zodResolver(schema) });

const onSubmit = async (data) => { await fetch('/api/register', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify(data) }); };

return ( {errors.email && {errors.email.message} } {errors.password && {errors.password.message} } {errors.confirmPassword && {errors.confirmPassword.message} } Register ); } Növbəti Növbəti Növbəti Növbəti ( və , “İnter” və “Renault” şirkətləri bu barədə məlumat yayıblar: “İnter” və “Renault” şirkətləri işləyir react-hook-form @hookform/resolvers zod Blazor (with built-in DataAnnotations): @page "/register" @inject HttpClient Http

model.Email" /> model.Password" /> model.ConfirmPassword" />

Register

@code { private RegisterModel model = new(); private bool isSubmitting = false;

private async Task HandleSubmit() { isSubmitting = true; await Http.PostAsJsonAsync("/api/register", model); isSubmitting = false; }

public class RegisterModel { [Required, EmailAddress] public string Email { get; set; } = "";

[Required, MinLength(8, ErrorMessage = "Password must be at least 8 characters")] public string Password { get; set; } = "";

[Required, Compare(nameof(Password), ErrorMessage = "Passwords don't match")] public string ConfirmPassword { get; set; } = ""; } } Zero additional packages. The validation attributes are built into .NET. handles the submit flow. Onu da qeyd etmək lazımdır ki, bu problemin həllində olan problemlər də var. EditForm DataAnnotationsValidator Data Fetching React (with useEffect - the footgun everyone steps on): import { useState, useEffect } from 'react';

export default function UserList() { const [users, setUsers] = useState([]); const [loading, setLoading] = useState(true); const [error, setError] = useState(null);

useEffect(() => { let isMounted = true; // Cleanup flag to prevent state updates after unmount

fetchUsers();

return () => { isMounted = false; }; // Cleanup }, []);

if (loading) return Loading... ; if (error) return Error: {error} ;

return ( {users.map(user => ( {user.name} ))} ); } Təsadüfi təmizlənmə prosesi . I spent two hours last year hunting down a memory leak because a junior dev forgot this pattern. The error message? "Can't perform a React state update on an unmounted component." Helpful. isMounted Blazor: @page "/users" @inject HttpClient Http

@if (users == null) { Loading... } else if (error != null) { Error: @error } else { @foreach (var user in users) { @user.Name } }

@code { private List ? users; private string? error;

protected override async Task OnInitializedAsync() { try { users = await Http.GetFromJsonAsync >("/api/users"); } catch (Exception ex) { error = ex.Message; } } } No cleanup needed. Blazor handles component lifecycle properly. No dependency array to forget. runs once when the component loads. OnInitializedAsync Əməkdaşlıq prosesləri (çocuğa, valideynə və uşaqlara) React: // Parent function Parent() { const [selectedItem, setSelectedItem] = useState(null);

return ( {selectedItem && } ); }

// Child function ItemList({ onItemSelected, highlightedId }) { const items = [...];

return ( {items.map(item => ( onItemSelected(item)} > {item.name} ))} ); } Blazor: @* Parent *@

@if (selectedItem != null) { }

@code { private Item? selectedItem; } @* ItemList.razor *@ @foreach (var item in items) { SelectedItem = item"> @item.Name }

@code { private List items = [...];

[Parameter] public Item? SelectedItem { get; set; }

[Parameter] public EventCallback SelectedItemChanged { get; set; } } İŞİD syntax automatically wires up two-way binding between parent and child. Convention over configuration. @bind-SelectedItem The Ceremony Comparison Task React Blazor Two-way binding + (every. single. field.) value onChange @bind Form validation Pick a library, write a schema, pray Built-in DataAnnotationsValidator Data fetching + cleanup + deps array (good luck) useEffect OnInitializedAsync State management This week's favorite: Redux? Zustand? Jotai? Class fields. Call when needed StateHasChanged() DI Roll your own with Context or install a library (it just works) @inject Parent-child binding Props down, callbacks up @bind-PropertyName İki tərəf bağlayıcı + (İstər ki, hər yerdə value onChange @bind Form validation Pick a library, write a schema, pray Built-in DataAnnotationsValidator Data fetching + cleanup + deps array (good luck) useEffect OnInitializedAsync State management Bu ayın ən sevimli: Redux? Zustand? Jotai? Qazaxıstan.az xəbər verir when needed StateHasChanged() DI Roll your own with Context or install a library (it just works) @inject Uşaq bağlayıcısı Düşünürəm ki, Callbacks Up @bind-PropertyName See the pattern? Blazor does the same thing with less code and fewer choices to agonize over. Why Blazor Actually Works for Me Onların hamısını hökm edən bir dil This is the killer feature. With Blazor, I write C# on the frontend and C# on the backend. Same language. Same type system. Same patterns. // Shared model used by both frontend and backend public record CreateOrderRequest( string CustomerId, List Items, ShippingAddress Address );

// API endpoint [HttpPost] public async Task > CreateOrder(CreateOrderRequest request) { // Validate, process, return }

// Blazor component calling the API var order = await Http.PostAsJsonAsync ("api/orders", request); "Mən API-ni güncellədim, amma TypeScript tiplərini günceltməyi unutdum" kompilator hər şeyi tapır. Type Safety That Actually Means Something C# is statically typed. Not "we added types later and hope you use them" typed. The compiler is your friend, and it will tell you about problems Kullanıcılar onları görürlər. before // This won't compile. Period. int count = "five"; // Error CS0029

// Pattern matching catches nulls at compile time if (user is { Email: var email }) { SendWelcomeEmail(email); // email is guaranteed non-null here } As , "combining these tools with the type safety of the language allows developers to write code with a lot more confidence up-front, not having to worry about runtime errors like unexpected nulls." Emergent Software notes SOLID Principles Are First-Class Citizens .NET was designed with dependency injection and interface-based programming in mind. Implementing SOLID principles isn't fighting the framework-it's using it as intended. // Program.cs - Clean DI registration builder.Services.AddScoped (); builder.Services.AddScoped (); builder.Services.AddScoped ();

// Component receives dependencies automatically @inject OrderService Orders @inject NavigationManager Navigation

@code { private async Task SubmitOrder() { var result = await Orders.CreateAsync(currentOrder); if (result.IsSuccess) { Navigation.NavigateTo($"/orders/{result.Value.Id}"); } } } Try achieving this level of clean dependency injection in React without a third-party library and a configuration ceremony. Debugging That Doesn't Make You Cry Visual Studio'nun Blazor ilə debugger həqiqətən mükəmməldir. Breakpoints işləyir. Step-through işləyir. Watch expressions work. The call stack actually makes sense. I can set a breakpoint in my Blazor component, step through my business logic, and trace execution all the way to the database and back. Same debugger, same tools, same experience as any other C# application. private async Task LoadOrders() { // Set a breakpoint here var orders = await OrderService.GetRecentAsync(customerId);

// Inspect 'orders' in the debugger // See the actual types, not 'object Object'

this.orders = orders; } Bunu React-in düzəltməsinə bənzəyin ki, böyüklərinizin DevTools, React DevTools və Redux DevTools-i bir dəfə çırpın. array. The symptom was silent infinite re-renders. Blazor's debugger would have caught that in seconds. useEffect The .NET Ecosystem is Stable (Boringly So) Bu problemin həllini davam etdirir. .NET ekosistemi yavaş-yavaş gedir. "NutGet" paketi uzun müddətli dəstəklənir. "Newtonsoft.Json" "13" versiyasında qalmağa karar verdiyi zaman heç kəs paniğe düşmədi. Hala işləyir. Xatırladaq ki, “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React” “React Real-World Advantages Sürücülər trivialdır Xatırladaq ki, bir neçə ildir ki, bu kitablar bir-birində yazılır. // Shared.Validation/OrderValidator.cs public class OrderValidator : AbstractValidator { public OrderValidator() { RuleFor(x => x.Items).NotEmpty(); RuleFor(x => x.Total).GreaterThan(0); RuleFor(x => x.ShippingAddress).NotNull(); } }

// Use in Blazor component // Use in API controller // Use in background service // Same validation, everywhere Modeli tanıyırsınız If you know Razor syntax from MVC or Razor Pages, Blazor components will feel natural. The learning curve for .NET developers is measured in days, not months. // Component with parameters - looks like any other C# class @code { [Parameter] public Order Order { get; set; } = default!;

[Parameter] public EventCallback OnOrderUpdated { get; set; }

[CascadingParameter] public UserContext? User { get; set; } } Performans dramatik şəkildə artıb “Blazor WebAssembly”in başlanğıcında həqiqətli performans problemləri vardı.O günlər çox geriyə düşüb – hər bir .NET versiyası böyük yaxşılıqlar gətirdi. .NET 8 introduced: : Partial JIT compilation in the browser, replacing slow interpreter bytecodes with optimized WebAssembly Jiterpreter SIMD: WebAssembly Single Instruction, Multiple Data for vectorized computations (Vektorləşdirilmiş hesabatlar üçün Multiple Data) AOT kompilasiyası: C# kompilasiyası doğrudan WebAssembly-ə CPU-qorxulu işlərdə yaxın yerli performans üçün .NET 9 added: : Removes IL after AOT compilation, significantly reducing bundle size WasmStripILAfterAOT : Better assembly deferral for faster initial loads Improved lazy loading WebSocket Compression: Interactive Server komponentləri üçün standartlaşdırılır .NET 10 delivers: : Static assets preloaded via Link headers before the page renders Framework asset preloading : Browser downloads and caches critical assets earlier High-priority resource scheduling : New diagnostic tools for WebAssembly apps Performance profiling counters Auto-memory pool eviction: uzun sürən proqramlarda daha yaxşı memoriya yönetimi So: Static SSR outperforms React on initial load because you're serving pre-rendered HTML with zero JavaScript hydration overhead. AOT compilation gets WebAssembly apps to near-native speed. You pick the right mode for each page. Blazor's Rapid Evolution: .NET 8, 9, and 10 One thing that impressed me about Blazor is how aggressively Microsoft has been improving it. This isn't a side project-it's a first-class citizen in the .NET ecosystem. .NET 8: “Blazor Birləşmiş” devrimi .NET 8 “Blazor”un necə işlədiyini dəyişdi .NET 8-dən əvvəl, seçmək lazımdır: Blazor Server “Blazor WebAssembly”, “Blazor WebAssembly”, “Blazor WebAssembly”, “Blazor WebAssembly”, “Blazor WebAssembly”, “Blazor WebAssembly”, “Blazor WebAssembly” Birləşmiş Modeli və ya Hər şey dəyişdi. komponentləriniz serverdə açıq HTML kimi görünür. SignalR bağlantısı yoxdur, WebAssembly download yoxdur. Sadəcə, sürətli, SEO dostu HTML. Static Server-Side Rendering (SSR) // A static SSR page - renders as pure HTML @page "/about" @attribute [StreamRendering]

About Us

About Our Company This renders as static HTML. Search engines love it.

The new Blazor Web App template defaults to SSR, with interactivity as an opt-in enhancement. This is a fundamental shift in philosophy-you start with the fastest, most SEO-friendly option and add interactivity only where needed. .NET 9: Mixing Modes with Precision doubled down on flexibility. The new Sizin seçdiyiniz bir neçə sayfa HTTP cookie-yə və ya istefa / cavab döngüsüne bağlı olan saytlar üçün statik SSR-i istifadə etmək. .NET 9 [ExcludeFromInteractiveRouting] must @page "/privacy-settings" @attribute [ExcludeFromInteractiveRouting]

// This page always renders statically, even in an otherwise interactive app .NET 9 üçün yeni funksiyalar: WebSocket Compression Interactive Server komponentləri üçün standartlaşdırılmışdır Yeni RendererInfo API vasitəsilə Runtime-də Render Mode Detection “Blazor Server” proqramları üçün yeniləmə prosesi .NET 10: Performance and Polish shipped with significant Blazor improvements: .NET 10 Blazor Script: Blazor Script: Blazor Script: Blazor Script: Blazor Script: Blazor Script: Blazor Script: Blazor Script: Blazor Script: Blazor Script: Blazor Script: The Blazor Script is now served as a static web asset with automatic compression and fingerprinting, significantly reducing payload size and improving caching. Blazor script optimization • Yeni attribute simplifies sharing data between pre-rendering and interactive renders: Persistent component state [PersistentState] @code { [PersistentState] public List ? Movies { get; set; }

protected override async Task OnInitializedAsync() { // State is automatically restored from prerendering Movies ??= await MovieService.GetMoviesAsync(); } } : Artıq bir neçə ildir ki, bu problemlər həll olunacaq, yeni problemlər yaranacaq. Əsas sayfa Better 404 handling NavigationManager.NotFound() NotFound.razor : Server circuits now expose traces as top-level activities, making observability in Application Insights much cleaner. Improved diagnostics Xatırladaq ki, “Blazor” hər gün daha sürətli, daha fleksibil və daha çox istehsal hazırlaşır. When React Still Makes Sense “React”un pis olduğunu söyləmək üçün buradayam. “React”u seçin. “React”u seçin. “React”u seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. “React”ı seçin. React's ecosystem is massive. If you need an obscure charting library or a drag-and-drop grid that does exactly one weird thing, someone's probably built it. That's genuinely valuable. But if you're a .NET shop building internal tools, line-of-business apps, or anything that needs to run for more than three years? Blazor is worth a serious look. “Blazzar”la başlayır If you're curious, here's the quickest path to a running Blazor app: # Create a new Blazor Web App (.NET 8+) dotnet new blazor -o MyBlazorApp cd MyBlazorApp dotnet run Bu deməkdir ki, yox İnternetin yarısını 3 dəqiqə çəkmək lazımdır. folder larger than your actual code. No və ya ilə mübahisə etmək. npm install node_modules .babelrc webpack.config.js The “Microsoft”un dokumentları MSDN günlərindən bu yana uzun bir yoldur. official Blazor documentation Xatırladaq ki, “Blazor”la bağlı problemlər var. Xatırladaq ki, “Blazor vs. React” debatunda hər bir mübahisə eşitdim. “Blazor WebAssembly” paketi çox böyükdür? In 2020? Yeah, it was rough. First load could hit 2-3MB. Xatırladaq ki, .NET 8+ matçını dəyişdi: ATV-nin təchizatı uzun müddət davam etdirir IL trimming strips unused code Müəllimlər “Not Critical Assembly” .NET 10 adds automatic compression and fingerprinting Amma həqiqətən, daha smart cavab: WebAssembly-i hər kəsə göndərməyin. Landing pages üçün Static SSR (zero WASM) istifadə edin. authenticated bölümlər üçün Interactive Server istifadə edin. Offline sahələr üçün WebAssembly və ya ağır müştərilərin hesablanması üçün Save WebAssembly. Are JavaScript developers easier to hire than Blazor developers? Nə üçün işlədiyinizə bağlıdır. Xatırladaq ki, bir neçə il öncə “C#” sisteminin yaradıcısı “Blazor”u bir neçə gün sonra alacaq.Komponent modeli dərhal tıklayır, sintax yalnız “Razor”dur və onlar dili bilirlər.Bu, üç il öncə bunu öyrəndikləri “React” sisteminin yaradıcısını işləməyə bənzəyir. Qrupun seçdiyi meta-framework nə olursa olsun. use .NET Talent Pool böyük, stabil və tam dəstək yetərlidir. Backend geliştiriciniz kontekst dəyişdirən dilləri olmadan frontend PR-ləri gözləyə bilər. “React”in “Blazor”dan daha çox üçüncü tərəf komponentləri var? Yes. Full stop. Hər bir pullu React komponent kütləvi üçün, təhlükəsizlik qapıları, uyğunsuz peer bağımlılıqları və "TOTO: dokumentasiya ekləmək" deyən READMEs vardır. Blazorun ekosistemi daha kiçikdir, lakin bulduğunuz paketi hala saxlamaq ümidiyle npm-ni keçirmisiniz. Əsas səhifə » Xəbərlər » Əsas səhifə » Əsas səhifə » Əsas səhifə » Əsas səhifə and both offer free community licenses if you need more. Enterprise shops usually go Destek sözleşmələri üçün. MudBlazor Radzen Syncfusion Telerik And when you absolutely need a JavaScript library? lets you interop cleanly: IJSRuntime @inject IJSRuntime JS

@code { private async Task InitializeChart() { await JS.InvokeVoidAsync("Chart.bindings.init", chartElement, chartData); } } Siz JavaScript ekosistemindən qapılmırsınız. Ona görə depend SEO üçün yaxşı olarmı? Static SSR renders pure HTML. Google sees it, indexes it, done. Same as Next.js SSR but in C#. This objection made sense in 2020 when Blazor was WebAssembly-only. It hasn't been true for years. Can Blazor be used for mobile apps? Bir dəfə komponentlərinizi yazın, onları MAUI (iOS / Android / Windows / macOS), WPF, ya da Windows Forms-da çalışdırın. Same C# components, native app shell. Not quite "write once, run anywhere" but close enough for most use cases. Xatırladaq ki, “Blazor Tooling” “VS Code” kimi yaxşıdır. Düşünürəm ki, daha yaxşıdır, amma bu subjektivdir. Visual Studio with Blazor: real debugging with breakpoints and step-through, IntelliSense that understands your entire codebase, refactoring that works across components and services, Hot Reload that mostly works, integrated testing and profiling. V.S. Code with React: syntax highlighting, IntelliSense ki, TypeScript düzgün yapılandırılmışsa işləyir, ümid Bu, bir-birinə mübahisə edə bilməyən və ya bir-birinə mübahisə edə bilməyən browser uzantılarıdır. launch.json Bir neçə ildir ki, bir neçə ildir ki, “Blazor”da “Debugging”, “Blazor”da “Debugging”, “Blazor”da “Debugging”, “Debugging”da “Debugging”, “Debugging”da “Debugging”, “Debugging”da “Debugging”, “Debugging”da “Debugging”, “Debugging”da “Debugging”da “Debugging”da “Debugging”da “Debugging”da “Debugging”da “Debugging”da “Debugging”da “Debugging”da “Debugging”da “Debugging” və “Debugging”da “Debugging”da “Debugging”da “Blazor” “Microsoft”ın “Vendor Lock-in”ini yaratır? .NET Open Source (MIT lisenziyası).Blazor Open Sourcedir. Linux, Docker, AWS, Azure və hər yerdə çalışdırabilirsiniz. Is there ecosystem gravity toward Azure? Sure. But I've deployed Blazor apps to AWS, DigitalOcean, and bare metal servers without issue. Compare this to React, which is technically open source but practically controlled by Meta's priorities. When Facebook decided class components were out, the entire ecosystem pivoted. When they pushed Server Components, everyone scrambled. “Microsoft” “Roadmap”u təqdim edir. Does Blazor Hot Reload work properly? .NET 8-də bu işə başlayıb. . Edit a Xatırladaq ki, bu, bir neçə ildir, bir neçə ildir, bir neçə ildir. .NET 10 sonunda yaxşı oldu .razor - Bəlkə, bu qədər sürətli deyilmi? – deyə soruşuram. Final Thoughts Xatırladaq ki, “Blazor”a keçmək bütün problemlərimi düzəltməyib.Həqiqətən də buglar yazıram.Həqiqətən də arkitektur hatalar yapıram.Həqiqətən də zaman zaman bir şeyləri düzəltmək üçün çox vaxt xərcləyirəm. But I've stopped spending mental energy on which state management library is "correct" this month. I don't wonder whether my TypeScript types match runtime data anymore (spoiler: they often didn't). I'm not updating seventeen npm packages every time Dependabot yells at me. Bir dil, bir ekosistem. .NET-in 10 il ərzində çalışdığım modellər.Bu, kompromisdir və mənim üçün buna görədir. Amma, əgər siz bir .NET geliştiricisi olsanız ki, heç vaxt sizin Bir gün artıq, bu imkan olmaz, bir gün artıq gec ola bilər. package.json Sonrakı nədir? Əgər bunu istəyirsənsə: . That's the whole setup. dotnet new blazor -o MyFirstBlazorApp && cd MyFirstBlazorApp && dotnet run Microsoft şirkətləri Qiymətlidir və Mənimlə tanış olan ən yaxşı teknik adamlardan biri idi. Blazor tutorials R / Bəlkə Questions? Drop a comment or find me on social. I like talking about this stuff. Sources: Şirkətlər : 2025-ci ildə reaksiya və topluluğun durumu Əgər reaksiya olmasaydı, nə olardı? Why the Latest JavaScript Frameworks Are a Waste of Time Bəlkə JavaScript daha yaxşıdır? Blazor vs React: A Comprehensive Comparison ASP.NET Core Blazor Apps - Microsoft öyrən .NET 8-də Blazor: Server-Side və Streaming Rendering “Blazor”da statik server-side renderinqin faydaları .NET 10-da yeni nə var - Microsoft Learning ASP.NET Core-də .NET 10-də yeni nə var - Microsoft Npm Supply Chain Attack - Palo Alto Ağları Shai-Hulud 2.0 Supply Chain Attack - WIZ npm left-pad Incident - Wikipedia Malicious Package – “Snyk” “Hər şey” paketi – “Socket” About the Author Mən dağıtılmış sistemlər, .NET təmiz kodu, logging, performans, və istehsal debugging haqqında heyran bir Systems Architectəm. folders more times than I'd like to admit. node_modules Linkedin: Mənimlə əlaqə saxla Təsadüfi: Tədbirlər Twitter/X: @mashrulthunder