NodeJS让前端与后端更友好的分手
学问
- 页面在访问后离线依然可以查看。
- 首屏展现速度要快,不允许长时间白屏或loading。
项目现状
- 打开web,加载基本资源,如CSS,JS等
- 发起一个ajax请求再到服务端请求数据,同时展示loading
- 得到json格式的数据后再根据逻辑选择模板渲染出”DOM字符串"
- 将”DOM字符串”插入页面中webview渲染出DOM结构
让服务端人员来写页面?
一种折中的解决方案
<script>
var _jsonData = [{a: 1}, {a: 2}, …];
</script>
Er...更激进的解决方案
- 浏览器请求服务器端的NodeJS
- NodeJS再发起HTTP去请求JSP
- JSP依然原样API输出JSON给NodeJS
- NodeJS收到JSON后再渲染出HTML页面
- NodeJS直接将HTML页面flush到浏览器
- app的WEB页可以实现离线存储技术
- 页面首屏渲染更快
- 由于NodeJS与页面在同一个域名下,所以就不用跨域了,而不用HTML5输出头信息这样的方式去实现跨域了
- 服务端与客户端逻辑都由前端人员控制都是使用JAVASCRIPT语言,前端程序猿可以更好的控制和优化,套页面什么的不容易出错
- 真正服务端程序人员不需要再关心页面的渲染逻辑,仅需要关心数据的处理
- 增加了前端人员的工作
- 前端人员需要对服务端程序有一定的了解
- 服务端需要架起NodeJS服务
- 通过NodeJS架接后台服务过程中通信时间上必然有一部分损失
项目中实际应用经验
NodeJS让前端与后端更友好的分手的更多相关文章
- 在web开发中,为什么前端比后端更得到转行程序员的青睐?必看!
1.Web开发分类与区别 人们通常将Web分为前端和后端,前端相关的职位有前端设计师(UI/UE),前端开发工程师,后端相关的有后端开发工程师. 2.技术栈区别 看各大招聘网站上,公司对前端开发工程师 ...
- 架构模式: 服务前端的后端(BFF模式)
架构模式: 服务前端的后端(BFF模式) 上下文 让我们假设您正在构建一个使用Microservice体系结构模式的在线商店,并且您正在实现产品详细信息页面.您需要开发产品详细信息用户界面的多个版本: ...
- 系统架构:Web应用架构的新趋势---前端和后端分离的一点想法
最近研究servlet,看书时候书里讲到了c/s架构到b/s架构的演变,讲servlet的书都很老了,现在的b/s架构已经不是几年前的b/s架构,其实b/s架构就是web应用开发,对于这样的架构我们现 ...
- [转载]Web前端和后端之区分,以及面临的挑战
原文地址:Web前端和后端之区分,以及面临的挑战[转]作者:joyostyle 在我们实际的开发过程中,我们当前这样定位前端.后端开发人员. 1)前端开发人员:精通JS,能熟练应用JQuery,懂CS ...
- Web前端和后端之区分,以及…
原文地址:Web前端和后端之区分,以及面临的挑战[转]作者:joyostyle 在我们实际的开发过程中,我们当前这样定位前端.后端开发人员. 1)前端开发人员:精通JS,能熟练应用JQuery,懂CS ...
- [转载]Web前端和后端之区分,以及面临的挑战【转】
原文地址:Web前端和后端之区分,以及面临的挑战[转]作者:joyostyle 在我们实际的开发过程中,我们当前这样定位前端.后端开发人员. 1)前端开发人员:精通JS,能熟练应用JQuery,懂CS ...
- 看完让你彻底理解 WebSocket 原理,附完整的实战代码(包含前端和后端)
1.前言 最近有同学问我有没有做过在线咨询功能.同时,公司也刚好让我接手一个 IM 项目.所以今天抽时间记录一下最近学习的内容.本文主要剖析了 WebSocket 的原理,以及附上一个完整的聊天室实战 ...
- java前端与后端怎么选??
想做这个行业,就应该了解职能以及技能需求,这样学习才能更高效.我知道一些刚刚入行的小伙伴不清楚前端.后端.到底指的是什么?两者直接的区别 前端开发 前端开发主要涉及网站和App,用户能够从浏览器上或A ...
- 那些年,我的前端/Java后端书单
全文为这些年,我曾阅读.深入理解过(或正在阅读学习.即将阅读)的一些优秀经典前端/Java后端书籍.全文为纯原创,且将持续更新,未经许可,不得进行转载.当然,如果您喜欢这篇文章,可以动手点点赞或者收藏 ...
随机推荐
- IE下Userdata本地化存储
这两天看了下Discuz x2发帖的实时保存机制,涉及到本地化存储,所以上网查了下,Firefox等支持HTML5的浏览器使用window.localStorage或window.sessionSto ...
- linux下安装java jdk
第一步:查看java对应版本 yum search java 我自己装的是1.8版本的java包 第二步:装java包 yum install java-1.8.0-ope ...
- 打豪车应用:uber详细攻略(附100元优惠码)
在嘀嘀打车和快的打车交战热闹的时候,美国的打车应用uber进入中国.与在美国以个人司机注册做 Uber 司机为主的模式不同,Uber 在中国采用与租车公司合作.由租车公司提供车辆和司机的模式,同时中文 ...
- 【uoj#280】[UTR #2]题目难度提升 对顶堆+STL-set
题目描述 给出 $n$ 个数 $a_1,a_2,...,a_n$ ,将其排为序列 $\{p_i\}$ ,满足 $\{前\ i\ 个数的中位数\}$ 单调不降.求字典序最大的 $\{p_i\}$ . 其 ...
- MySQL复制 -- binlog(2)
MySQL复制是使用最为广泛的一套组建,上一节已经简单说了一下复制的一些用途和复制的原理,知道了这些我们能够快速的搭建起复制的平台,但是仅知道这些还是不够的,很多时候并不是一帆风顺的,总会有那么一小段 ...
- selenium实战之斗鱼弹幕
python3.6.selenium.chromedriver 先上代码 from selenium import webdriver from time import sleep driver=we ...
- C++ STL 常用拷贝和替换算法
C++ STL 常用拷贝和替换算法 copy() 复制 vector<int> vecIntA; vecIntA.push_back(1); vecIntA.push_back(3); v ...
- 【codeforces 528D】 Fuzzy Search
http://codeforces.com/problemset/problem/528/D (题目链接) 题意 给定母串和模式串,字符集大小为${4}$,给定${k}$,模式串在某个位置匹配当且仅当 ...
- 使用apt-mirror搭建debian本地仓库
apt-mirror能够将官方镜像下载到本地,并保证目录结构与其一致,但是不能对镜像仓库进行修改.如果想要修改镜像仓库,需要使用reprepro. 1.安装apt-mirror # aptitude ...
- 单点登录(十七)----cas4.2.x登录mongodb验证方式成功后返回更多信息更多属性到客户端
我们在之前已经完成了cas4.2.x登录使用mongodb验证方式登录成功了.也解决了登录名中使用中文乱码的问题. 单点登录(十三)-----实战-----cas4.2.X登录启用mongodb验证方 ...