精华内容
下载资源
问答
  • 什么是后端渲染?什么又是前端渲染呢?后端渲染和前端渲染又有什么区别呢? 最近在学习Vue的时候接触到了这个话题,我觉得还挺有意思的,所以写下来,记下来。 一、什么是后端渲染? 我们都知道现在的网页都由...

    什么是后端渲染?什么又是前端渲染呢?后端渲染和前端渲染又有什么区别呢?

    最近在学习Vue的时候接触到了这个话题,我觉得还挺有意思的,所以写下来,记下来。


    一、什么是后端渲染?

    我们都知道现在的网页都由html+css+js组成,但是在比较早的时候是没有js(JavaScript)的。所以那时候网页开发一般都是用html+css+jsp(java server page)/php来开发。我自学前端写的第一个算是有网络交互功能的东西(留言板)用的就是html+css+php来完成的(php代码的作用是从数据库中读取数据,并且把它动态的放在要渲染的页面上)。以我写的留言板为例,当我们从浏览器输入一个url的时候,浏览器会将我们输入的url发送到服务器上。当服务器拿到这个url的时候,服务器会进行解析然后在后台生成一个包含html+css+js+php的网页。这时候服务器端就已经生成一个最终的网页了,网页渲染好之后,就会把渲染好的网页直接传给浏览器(html+css+数据),这就是最终的网页了,这就是后端渲染。所以后端渲染简单的说就是,网页在服务器渲染完成,再返回给浏览器,网页是在服务器端进行渲染,而不是在浏览器端进行渲染。
    我写的留言板用的是前后端分离,当然,我们也可以只用html+css+php来完成,也就是我们的后端渲染
    早期的网页整个html都是服务器来渲染,服务器直接生产渲染好对应的html页面,返回给客户端进行展示

    二、那么什么又是前端渲染呢?

    在明白我们所说的后端渲染之后,其实大家很容易就能想到前端渲染是什么样的。在经历过比较早的阶段之后,随着Ajax的出现,就有了我们的前后端分离的阶段。这时候后端只提供API来返回数据,前端通过Ajax获取数据,并且可以通过JavaScript将数据渲染到页面中。举个例子,当我们从浏览器输入一个url的时候,浏览器会将我们输入的url发送到服务器上,然后再从服务器返回html+css+js(js代码由浏览器执行)。然后我们的客户端,也就是我们的浏览器再通过Ajax请求(API),然后服务器接收请求返回数据,浏览器接收到数据后再进行动态渲染,局部刷新页面,这就是我们的前端渲染。
    我写的留言板用的是前后端分离,通过Ajax来动态获取数据进行渲染

    三、后端渲染和前端渲染又有什么区别呢?

    看到这里,想必大家都能明白了后端渲染和前端渲染的区别。在比较早的时候,后端程序员好像是比较辛苦的,又要写数据处理,又得写网页,而那时候的前端被戏称为“切图仔”,在当时开发分工是比较混乱的,维护起来也麻烦。来到了前后端分离阶段后,前后端责任分工开始清晰了起来,后端专注于数据上,前端专注于页面交互和页面的可视化。并且当移动端(ios系统,android系统)出现后,后端不需要进行任何处理,依然使用之前定的一套API就可以。

    总结

    随着技术的发展,网页开发也朝着越来越好,越来越精的方向走去。后端渲染和前端渲染的区别主要就是渲染的方式不同。(以上仅代表个人意见,新人一枚,如有错误,多多指正!如果觉得我写的还可以请大家多多点赞哦)

    展开全文
  • 前端渲染与后端渲染

    2020-03-26 23:45:43
    后端渲染 大概十年前,JSP、PHP、ASP等为大多数网站使用,网站也是由后端作为渲染。因为大多数工作都是由后端完成,对后端人员要求较高,前端的地位也就比较低。 后端渲染的优势: 第一次搭建简单网站的速度快 SEO...

    后端渲染

    大概十年前,JSP、PHP、ASP等为大多数网站使用,网站也是由后端作为渲染。因为大多数工作都是由后端完成,对后端人员要求较高,前端的地位也就比较低。

    后端渲染的优势:
    1. 第一次搭建简单网站的速度快
    2. SEO(搜索引擎优化)友好度高,特别是对于一些营销购物推广类网站
    3. 服务器渲染不用关心浏览器兼容性问题(随着浏览器发展,优点在消失)
    4. 减少客户端的消耗
    5. 安全性比前端渲染稍好
    后端渲染的劣势
    1. 占用服务器资源,对服务器的要求较高
    2. 维护性差,稍微更改需求就要设计后端更改
    3. 对于复杂类的网站,编码效率低,后端无法专注数据,前端无法专注视图

    前端渲染

    随着Angular,React,Vue等前端框架的崛起,现在网站大部分都是前端渲染。前端开发人员地位提升

    前端渲染的优势
    1. 前后端分离,专注于自己的事情,开发效率高
    2. 可维护性高
    3. 页面相应速度快,因为改变的只有数据,可实现懒加载和局部刷新
    4. 减少服务端的消耗
    前端渲染的劣势
    1. 不利于SEO优化
    2. 在页面首次加载时,时间较长
    3. 安全性比后端渲染稍差
    4. 第一次搭建网站成本较高
    展开全文
  • 后端渲染和前端渲染

    2020-02-17 21:33:15
    后端渲染和前端渲染 后端渲染 前端只有html+css,而在刚开始js是后端php,jsp来代替的,前端发送请求只能接收到后端传来的一段html的字符串。增加了后端人员的工作量。 前后分离 增加了静态资源服务器(html+js+css)...

    后端渲染和前端渲染

    后端渲染(html+css)
    刚开始前端只由,而在刚开始js是后端php,asp来代替的,前端发送请求只能接收到后端传来的一段html的字符串。

    前后分离(html+js+css)
    增加了静态资源服务器,具有缓存的作用,js+css+html会从上面下载下来,或者通过ajax来获取后端数据,而后端则通过API将数据传输出来,前端不用理后端提供的接口是ISO还是其他接口,然后js会将数据渲染到页面上,API接口在移动端也能用,即前端与APP都能用这个接口,jQuery也是采用这种模式。

    前端渲染(index.html+js+css)
    在前后分离的基础上加入了SPA(单页富应用),即一个网页只有一个HTML页面。
    如访问csdn.com时 先从静态资源服务器先下载html+css+js(都只有一个)到浏览器,一个页面中也可以分出多个页面如点击“我的”时,就会跳转csdn/home,不会从静态资源服务器中请求,而是通过先下载js中请求(也指映射),在把“我的”页面渲染出来,这些分页面需要前端路由的支撑。

    展开全文
  • 前端渲染 vs 后端渲染

    2019-05-16 20:38:00
    前端渲染 vs 后端渲染 前端渲染是通过ajax请求数据,然后通过js语法将数据展示到页面中,称之为前端渲染 后端渲染是通过后端语言 + 后端模板( ejs ) 将 页面整个发送给前端 后端模板 ejs pug( jade ) art-...

    前端渲染 vs 后端渲染

    1. 前端渲染是通过ajax请求数据,然后通过js语法将数据展示到页面中,称之为前端渲染
    2. 后端渲染是通过后端语言 + 后端模板( ejs ) 将 页面整个发送给前端
      1. 后端模板
        1. ejs
        2. pug( jade )
        3. art-template

    现在流行的: 前端渲染

    问题: 当前后端同时进行项目开发是, 后端数据接口没有写好,但是前端却需要这个接口,这个时候怎么办? 分析: 需要一段数据 解决: 模拟假数据( mock数据 json-server / mock.js )

    以上这种形式叫做 : 前后端架构分离

    很久以前,没有前端岗位的, 所有的网页都需要后端完成, 那个时候的情况我们称之为: 前后端耦合

    1. Node.js做项目的时候 ,就有两种选择了

      1. 前后端分离 :后端提供接口,前端渲染
      2. 前后端耦合: 后端渲染
    2. 直接借助一个工具来搭建一个Node.js项目,这个工具叫做 express-generator ,这个工具帮助我们实现了express框架

    3. 创建express项目的流程

      1. 安装 express-generator $ cnpm i express-generator -g

      2. 创建express 项目 $ express -e 项目名称 -e是安装 ejs 模板,支持js语法

      3. 分析目录

        • package.json 整个项目的依赖配置文件
        • app.js 是整个项目的入口文件
        • views/xx.ejs 是整个项目的模板(模板内容是什么,将来页面呈现就是什么)
        • routes 是整个项目的路由配置文件
        • public 静态资源文件(img css js )
        • node_modules 整个项目的依赖包
        • bin / www 整个项目的服务器配置文件
      4. 启动项目 package.json 中 npm 脚本 $ npm run start

      5. 研究项目代码

        • 入口文件 app.js
      //引入项目所需要的第三方包
        var createError = require('http-errors');
        var express = require('express');
        var path = require('path');
        var cookieParser = require('cookie-parser');
        var logger = require('morgan');
        //引入项目路由配置文件
        var indexRouter = require('./routes/index');
        var usersRouter = require('./routes/users');
        //创建app对象,是应用级中间件
        var app = express();
        // view engine setup
        app.set('views', path.join(__dirname, 'views'));
        app.set('view engine', 'ejs');
      
        app.use(logger('dev'));
        app.use(express.json());
        app.use(express.urlencoded({ extended: false }));
        app.use(cookieParser());
        app.use(express.static(path.join(__dirname, 'public')));
        //路由及中间件
        app.use('/', indexRouter);
        app.use('/users', usersRouter);
        // catch 404 and forward to error handler
        app.use(function(req, res, next) {
          next(createError(404));
        });
        //错误处理中间件,前面的所有中间件全部挂掉,错误处理中间件才会报错
        // error handler
        app.use(function(err, req, res, next) {
          // set locals, only providing error in development
          res.locals.message = err.message;
          res.locals.error = req.app.get('env') === 'development' ?         err : {};
          // render the error page
          res.status(err.status || 500);
          res.render('error');
        });
        module.exports = app;

    转载于:https://www.cnblogs.com/zhaoyingzi/p/10877847.html

    展开全文
  • 前端渲染和后端渲染

    2020-03-06 09:13:11
    什么是前端渲染,什么是后端渲染 1.早期的网页是后端渲染,用JSP,php开发网页,浏览器会把url地址发送给服务器,服务器会进行解析判断,就会把JSP给你(HTML+CSS+Java),Java作用是从数据库中读取数据,并且将它东...
  • 什么是前端渲染 什么是后端渲染 顾名思义 数据在后端渲染完毕后才传给前端叫做后端渲染,这个方式存在于jsp/php时代 后端路由:后端处理url和页面之间的映射关系 这种情况下渲染好的页面不需要单独加载css和js...
  • 前端渲染和后端渲染、前端路由和后端路由的区别和优缺点
  • 前端渲染和后端渲染,前端路由和后端路由
  • 后端渲染——nodejs

    2020-07-17 22:20:04
    后端渲染 前端写好静态页面 将静态页面交给后端 后端将html部分复制进动态文件中 php jsp asp(模板引擎) 对数据进行查询操作 交换给浏览器端(html) 后端渲染案例: 项目环境目录 dao/mysqlserver.js——连接数据库...
  • 后端渲染2.3 后端渲染的优缺点3. 前后端分离阶段3.1 前端渲染3.2 前端渲染的优缺点4.前端路由阶段4.1 前端路由的概念4.2 单页面开发的优缺点4.3 什么时候使用到前端路由? 写在前面: 认识前端路由和后端路由 前端...
  • Nuxt.js是vue官方推荐的一款优秀的服务端渲染(ssr)项目,集成了Vue,Vue-Router,Vuex,Vue-Meta等组件/框架,内置了webpack用于自动化构建,使我们可以更快速地搭建一个具有服务端渲染能力的应用。今天主要来了解下...
  • express后端渲染

    2019-05-21 16:41:51
    后端渲染一个页面 api接口 问题: 如果遇到了前后端不分离的项目, 你怎么做? 找后端,搭建项目启动的环境 找后端模板引擎 ( 找类似于 view 这样的目录 ) 找静态资源文件目录 找对应性文件, index.ejs index....
  • 在网上查找了很久的前端渲染和后端渲染的区别,最后总算在知乎上看到了一个比较清楚的解释,感谢万分! 作者:iakul 链接:https://www.zhihu.com/question/28725977/answer/42077482 来源:知乎 著作权归作者所有。...
  • 后端渲染: 指的是前端发送请求,后端用后台模板引擎直接生成html,前端接收到数据后直接插入页面 对比: 对比 前端渲染 后端渲染 页面显现速度 主要受限于带宽和客户端激起的好坏,优化的好,可以逐步动态...
  • 前端没兴起之前,网页的展示大都是后端渲染,也就是服务器渲染。 随着前端行业的发展,前端的工作越来越精细。前后端开始分离,前端只关注ui渲染。后端只提供数据和进行逻辑处理。 简单的解释,前端写好html模板,让...
  • 后端渲染 当用户在浏览器上输入网址时,相当于把url地址传给服务器,而服务器会根据html+css+java(java的作用是从数据库中读取数据,并将他动态的放在页面中)将网页渲染好,然后传给前端直接展示,这种情况下,不...
  • 前端渲染和后端渲染 后端渲染 服务器直接生产渲染好对应的HTML页面, 返回给客户端进行展示。比如:jsp页面 好处:前端耗时少,即减少了首屏时间,模板统一在后端。前端(相对)省事,不占用客户端运算资源(解析...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 4,996
精华内容 1,998
关键字:

后端渲染