tag ssr

標籤
貢獻16
69
02:19 PM · Nov 05 ,2025

@ssr / 博客 RSS 訂閱

京東雲開發者 - 極致性能優化:前端SSR渲染利器Qwik.js | 京東雲技術團隊

引言 前端性能已成為網站和應用成功的關鍵要素之一。用户期望快速加載的頁面和流暢的交互,而前端框架的選擇對於實現這些目標至關重要。然而,傳統的前端框架在某些情況下可能面臨性能挑戰且存在技術壁壘。 在這個充滿挑戰的背景下,我們引入了 Qwik.js 框架。Qwik.js 不僅是一個前端框架,更是一種前端性能的終極解決方案。它不僅提供了卓越的性能,還以其獨特的特點和優勢脱穎而出。 讓我們一起深入探索 Q

性能優化 , 前端性能 , ssr , 前端

收藏 評論

前端向後 - 從 Next.js 看企業級框架的 SSR 支持

一.Next.js 簡介 The React Framework for Production 面向生產使用的 React 框架(廢話)。提供了好些開箱即用的特性,支持靜態渲染/服務端渲染混用、支持 TypeScript、支持打包優化、支持按路由預加載等等: Next.js gives you the best developer experience with all the features

服務端渲染 , 前端框架 , ssr , Javascript

收藏 評論

Believer - Nuxt3入門(上)

Nuxt.js 是一個基於 Vue.js 的通用應用框架。 通過對客户端/服務端基礎架構的抽象組織,Nuxt.js 主要關注的是應用的 UI 渲染。原文可移步我的公眾號文章 🔧 安裝問題 ⚙️ 初始化項目失敗 npx nuxi@latest init my_nuxt3_app 1.連接 raw.githubusercontent.com 失敗 “Failed to connect t

nuxt3 , ssr , 前端

收藏 評論

派大星,海綿寶寶 - Nuxt3如何部署到Netlify

部署到 Netlify 上需要和 Github 結合,以後你只需要推送代碼就會自動部署。 Nuxt3 官網描述部署到 Netlify 先看官網怎麼Nuxt3官網怎麼描述的 零配置!!! 我看了很多YouTube視頻也是説不需要配置,結果就是所以的編譯和加載都ok,首頁就是沒有。 Netlify 在頁面點擊創建 這裏有三中方式,我就是選擇的第一種。反正我看了 Nuxt 説的,都是零配

node.js , netlify , vue3 , nuxt3 , ssr

收藏 評論

JasonMa - 一個開箱即用的已集成全部主流前端工具、類庫的nuxt3服務端渲染ssr項目

項目背景: 需實現公司國際官網項目的seo 如果是react就選用next,因為我最近在用vue3,就試試使用nuxt 在網上找了很多模版,發現都不理想,缺的東西比較多,沒法做到開箱即用,所以自己造個模版項目 採用當前最新的nuxt3實現 目錄簡介: 已集成各類主流vue3生態相關工具或庫 nuxt3 vue官方推薦的最好用,生態最全的nuxt3服務端渲染ssr框架 vue3

nuxtjs , vue3 , nuxt3 , ssr , 前端

收藏 評論

註銷 - Spartacus 6.8 成功開啓 SSR 的命令行

在一個已有的 Storefront 上,使用命令行:ng add @spartacus/schematics --ssr 最後使用下列命令行,可以成功啓動(記得先 build): 在現代的前端開發過程中,Angular 端到端的解決方案已經成為了許多開發人員和團隊的首選框架之一。Angular 不僅提供了一個健壯的平台來構建複雜的客户端應用,還通過各種工具和庫,如 Angular Schem

angular , ssr

收藏 評論

註銷 - 關於 serve-static 的 index.d.ts 報錯的問題分析

理解這條日誌的含義,需要我們深入分析其組成部分和背後可能的原因。這條日誌信息顯然指向了一個 Node.js 項目中的一個具體錯誤,其指出了錯誤發生的文件路徑和具體位置。接下來,我將逐步解析這條日誌信息的各個方面,並解釋可能的原因和解決方法,同時遵守你的要求,使解析過程既詳細又不顯得機械。 日誌信息解析 2024-01-01 05:08:15,120 INFO d.h.c.h.PrintOutput

react , ecmascript-6 , angular , ssr , 前端

收藏 評論

Gomi - Astro + NextUI 搭建個人博客(導航組件篇)

Astro 簡介 由於我之前的個人博客是Vue3+Quasar+Koa+MySql搭建的,整體就是SPA的思路,作為練手倒是可以鍛鍊前後端各方面的能力。但考慮到後期的遷移和更新等,實在過於麻煩,個人博客其實使用SSR或SSG之類的框架就行了,比如Nextjs,Nuxtjs,Remix等等。於是我接觸到了Astro這個框架,它厲害的是不與任何前端框架進行強行綁定,比如Nextjs是與React強綁定

astro , ssg , ssr , 博客搭建 , 前端

收藏 評論

Meathill - SSR,雲平台,ChatGPT——我的 2023 技術關鍵詞

前言 2023 年,因為換工作,啓動新項目等原因,我對我的技術棧進行了比較大的更新,主要集中在這三個方向: SSR(Server Side Rendering,服務器端渲染)。之前我開發的項目基本上都是 SPA(Single Page Application),比如 Vue,但之後我會越來越多開始用 Nuxt。由於基礎設施的發展,以後 SSR 會更方便更好用。 雲平台。以前我大概買了 3、4

2023-年度總結 , 雲平台 , chatgpt , 雲原生 , ssr

收藏 評論

superZidan - 深入探索 Next.js 中的流式渲染和分塊傳輸編碼

hello 大家好,我是 superZidan,這篇文章想跟大家聊聊 Next.js 中的流式渲染和分塊傳輸機制 ,如果大家遇到任何問題,歡迎 聯繫我或者直接微信添加superZidan41 🔥🔥🔥前方高能,乾貨滿滿,建議點贊➕關注➕收藏; 温馨提示:如果你還是個 Next.js 新手,建議先閲讀這篇 Next.js 最佳實踐,照着這篇文章先把代碼敲一遍 簡述 在本篇文章中,我們將深入探索組

node.js , next.js , stream , ssr , Javascript

收藏 評論

superZidan - Next.js 超實用進階技巧【持續更新】

hello 大家好,我是 superZidan,這篇文章想跟大家聊聊Next.js 進階技巧,如果大家遇到任何問題,歡迎 聯繫我或者直接微信添加superZidan41 🔥🔥🔥前方高能,乾貨滿滿,建議點贊➕關注➕收藏;後續還會 持續更新更多技巧和案例 温馨提示:如果你還是個 Next.js 新手,建議先閲讀這篇 Next.js 最佳實踐,照着這篇文章先把代碼敲一遍 Next.js 是一個強

性能優化 , next.js , ssr , Javascript

收藏 評論

路邊縣 - 服務端渲染nextjs項目接入經驗總結

服務端渲染 nextjs@14 項目接入經驗總結,本文重點介紹基本知識點/常用的知識點/關鍵知識點 背景 為提高首屏渲染速度減少白屏時間提高用户體驗及豐富技術面,開始調研和接入nextjs框架 優勢 nextjs是一套成熟的同構框架(一套代碼能運行在服務端也能運行在瀏覽器)對比傳統的客户端渲染的核心優勢是首屏是帶數據的和減少跨域帶來的option請求。其它後續操作是一樣的。理論上能比客户端渲染看到

react , 同構 , node.js , next.js , ssr

收藏 評論

Fortnight - 小談Angular SSR項目的國際化

特別聲明,本文由Fortnight_許帥博原創,受限於作者能力,文章或存在不足,歡迎大家指出。如需轉載,煩請註明出處。 前言 近日,我一直負責的項目已經成長到了一個較為穩定的狀態,因此早前被擱下的國際化問題又重新提了出來,為此,我對ngx-translate這個庫做了一些瞭解,但看完後我感到有些頭疼,因為項目中的出現的文案文本都需要替換為語言包文件中對應的鍵名,這是個繁瑣枯燥,又必須細心的工作。儘

angular5 , ssr , typescript , i18n

收藏 評論

牛刀殺雞 - 服務端渲染SSR

1.項目背景 需要將一箇舊的用vue+svg搭建的地鐵圖h5改造成有個ssr項目,以提升首屏渲染時間。 2.分析 項目現狀,項目組已有koa搭建的業務中間層,且需要改造的項目為一箇舊項目,綜合考慮,將舊項目進行改造,而非使用nuxt重寫。 3.SSR原理 1.所謂SSR就是將一個項目通過兩種打包配置,分別生成兩份打包代碼,一份在服務端(nodejs)執行,另一份在客户端(browser)上執行。當

vue.js , node.js , ssr , 前端

收藏 評論

Coder - 我第一個快200 Star 的項目,Taro H5 SSR 插件現在咋樣了

引言 我寫下這篇文章的初衷是,我認識到,編寫代碼的同時,我們也需要去分享我們的工作和成果,讓更多的人瞭解我們所做的事。這篇文章旨在記錄我的第一個近200 Star 的項目 tarojs-plugin-ssr,能讓更多的人去知道這個項目,瞭解到這個項目還被持續維護中。 我將在文章中講講這個項目的起源,回顧我與 Taro 項目的故事。同時,根據我有限的經驗,來回答一些朋友們關於如何參與開源項目的疑問。

小程序 , next.js , taro , ssr , 前端

收藏 評論

嘿嘿不務正業 - React SSR - 寫個 Demo 一學就會

今天寫個小 Demo 來從頭實現一下 react 的 SSR,幫助理解 SSR 是如何實現的,有什麼細節。 什麼是 SSR SSR 即 Server Side Rendering 服務端渲染,是指將網頁內容在服務器端中生成併發送到瀏覽器的技術。相比於客户端渲染(CSR),SSR 一般用於以下場景: SEO (搜索引擎優化):由於部分搜索引擎對 CSR 內容支持不佳,所以 SSR 可以提升網站在

react , ssr , 前端

收藏 評論

EsunR - 解決基於 Webpack 構建的 Vue 服務端渲染項目首屏渲染樣式閃爍的問題

前言 當我們使用 Webpack 搭建一個基於 Vue 的服務端渲染項目時,通常會遇到一個很麻煩的問題,即我們無法提前獲取到當前頁面所需的資源,從而不能提前加載當前頁面所需的 CSS,導致客户端在獲取到服務端渲染的 HTML 時,得到的只有 HTML 文本而沒有 CSS 樣式,之後需要等待一會兒才能將 CSS 加載出來,也就是會遇到『樣式閃爍』這樣的問題。 如果你想要完整 SSR 實踐,可以參考:

服務端渲染 , webpack , Css , ssr , 前端

收藏 評論

註銷 - 手動為 SAP Spartacus 添加 SSR 即服務器端渲染的步驟

ng add @spartacus/schematics --ssr 在用 SAP Spartacus 開發的 store 裏,能看到 devDependencies 裏具有 @spartacus/schematics 的依賴: 這是 SAP Spartacus Schematics 的一部分:https://sap.github.io/spartacus-docs/schematics. Sp

sap , spa , ssr , typescript , Javascript

收藏 評論

前端向後 - 4圖看懂React SSR中的hydrate

React CSR:水車模型 當初在理解 React CSR 時做過一個比喻,把單向數據流比作瀑布模型: 瀑布模型:由props(水管)和state(水源)把組件組織起來,組件間數據流向類似於瀑布。數據流向總是從祖先到子孫(從根到葉子),不會逆流 (摘自深入 React) 單組件的微觀視角下,我們把props理解為水管(數據通道),接收外部傳遞進來的數據(水),每一份state都是一處水源(

react , 服務端渲染 , ssr

收藏 評論

註銷 - Web 應用服務器端渲染入門指南

Rendering on the Web 作為開發人員,我們經常面臨會影響應用程序整個架構的決策。 Web 開發人員必須做出的核心決策之一是在他們的應用程序中實現邏輯和呈現的位置。 這可能很困難,因為有許多不同的方法來構建網站。 我們對這一領域的理解源於我們過去幾年在 Chrome 中與大型網站的交流工作。 從廣義上講,我們鼓勵開發人員考慮服務器渲染或靜態渲染,而不是完全重新 hydration

render , server , webpack , ssr , Web

收藏 評論

京東雲開發者 - vue的兩種服務器端渲染方案

本文參與了SegmentFault 思否寫作挑戰賽,歡迎正在閲讀的你也加入。 作者:京東零售 姜欣 關於服務器端渲染方案,之前只接觸了基於react的Next.js,最近業務開發vue用的比較多,所以調研了一下vue的服務器端渲染方案。 首先:長文預警,下文包括了兩種方案的實踐,沒有耐心的小夥伴可以直接跳到方案標題下,down代碼體驗一下。 前置知識: 1、什麼是服務器端渲染(ssr)? 簡單來説

服務端 , vue.js , 服務端渲染 , challenge , ssr

收藏 評論

前端向後 - 魚和熊掌兼得:Next.js 混合渲染

寫在前面 React 生態中,SSR 支持做得最好的可能是 Next.js,但 SSR 並不是Next.js的全部,只是其提供的預渲染支持之一: SSG(Static Site Generation/Static Generation):靜態生成,在編譯時生成靜態 HTML SSR(Server-Side Rendering):服務端渲染,用户請求到來時動態生成 HTML 通過各種方式在

服務端渲染 , 前端框架 , ssr , 前端

收藏 評論

imwty - Nuxt3實戰系列之網絡請求篇

Nuxt3提供了4種方式使得我們可以異步獲取數據 useAsyncData useLazyAsyncData (useAsyncData+lazy:true) useFetch useLazyFetch (useFetch+lazy:true) 4種方式中,其實核心的就是useAsyncData和useFetch。這兩個方法不同於Nuxt2中的asyncData和fetch。接下來我們

vue.js , 服務端渲染 , nuxtjs3 , vue3 , ssr

收藏 評論

imwty - Nuxt3實戰系列之配置管理

Nuxt提供了一個運行時配置API,在你的應用程序和服務器路由中暴露配置,並能在運行時通過設置環境變量進行更新。 定義運行時配置 為了將配置和環境變量暴露給應用程序,你需要在nuxt.config文件中使用runtimeConfig選項定義運行時配置。 export default defineNuxtConfig({ runtimeConfig: { // 只在服務端可以訪問的配置項

vue.js , nuxt.js , 服務端渲染 , vue3 , ssr

收藏 評論