前端代码发布案例参考

看了两个个知乎的回答, 自己总结下.

大公司里怎样开发和部署前端代码?回答一

  • 非覆盖发布:

    • 文件的摘要信息放到资源文件发布路径中, 这样内容有修改的文件变成了一个全新的文件, 不会覆盖之前的文件
    • 先全量部署静态资源, 再灰度部署页面.

大公司里怎样开发和部署前端代码?回答二

回答二: 简单情况下的发布方式

  • 前提: 前后端发布分离
  • 前端渲染, 不考虑SSR和BFF服务的发布, 只考虑页面发布.
  • 简单场景下: 可以使用中间托管服务FE getaway方式, 网站入口和所有配置, 主要功能如下:
    • 页面管理: 提供可用的URL
    • 模板托管: 管理后端模板
    • 遍历管理: 后端模板里各种变量的值, 也包括前端资源版本号
    • 三种合并到一起, 就是一个完整的html
  • 该情况下的发布流程:
    • 前端首先打包静态资源, 使用非覆盖发布方式, 发布到CDN
    • 静态资源的URL中含有版本号
    • 在变量管理中将要发布的模板版本号改为最新即可
  • 好处: 前端页面切割成各个工程, 互不影响
  • 坏处: 版本稀碎, 不易管理

回答二: 在先发布方式下的打包方式

  • 页面工程(js, css, img)和第三方库, 放到CDN上面.
  • 公共库: 全局使用或者高频使用的的组件和基础库代码打包成为bundle单独放到CDN上
    • 不一定是一个bundle, 可以组件一个, 非组件一个
    • 公共库, 使用webpack的external引向全局变量
    • 好处一: 项目之间的复用, 使用code split不能搞定
    • 好处二: 公共库的版本号便于管理, 公共库升级所有页面开发人员进行适配.
  • 组件库, 基础库使用npm发布
  • 构建页面的时候, 局部使用的组件和库, 使用npm install引入, 进行常规

大前端时代下的微前端架构

微前端是一种架构风格, 其中众多独立交付的前端应用组合成一个大型整体
通读文章后, 我认为微前端的方式需要再议. 并一定适合现在的需求

遗留问题

  • BFF服务是什么

原文地址:https://www.cnblogs.com/zhangrunhao/p/12165830.html

时间: 2024-10-05 01:29:59

前端代码发布案例参考的相关文章

Web 前端代码规范

Web 前端代码规范 最后更新时间:2017-06-25 原始文章链接:https://github.com/bxm0927/web-code-standards 此项目用于记录规范的.高可维护性的前端代码,这是通过分析 Github 众多前端代码库,总结出来的前端代码书写规范. 目录 前端普适性规范 HTML 规范 CSS 规范 JS 规范 License public domain, Just take it. Thanks @Ruan YiFeng: https://github.com/

Linux系统架构师之代码发布解决方案

我今年19了!人生有多少22K? 所有实验环境初始化: 创建本地光盘Yum源,安装tree lrzsz vim,关闭iptables和selinux. 定义别名cls='clear',ll='ls -Alh'. 代码发布解决方案: 1.安装优化软件环境 2.程序代码 3.配置变更 SVN是跨平台的开源版本控制系统.SVN会备份并记录文件每一次的修改更新的变动. SVN是通用的软件系统,常用来管理程序代码.常见的版本控制软件有:VSS.CVS.SVN.Git. Git与SVN的区别: SVN是一个

app前端代码打包步骤

一.搭建项目环境 1.安装node.js 在网上找到nodejs压缩包,下载解压后安装node-v8.9.3-x64.msi文件. 安装完毕后,在windows的cmd控制台输入node -v或node --version命令,测试是否安装成功,如图1.1,出现版本号就是成功了. 或 图1.1 测试nodejs图 2.安装npm npm(Node Package Manager)的安装,其实新版本的node已经集成了npm,所以安装成功node,就不用管这步了,为了保险,我们也测试下是否安装成功

前端代码异常监控总结

[这个在去年8月就起稿了,一直没有发布....] 一.前言 说到前端监控大家应该都不会陌生,这是现代前端工程的标配之一.引入前端监控系统,可以使用例如fundebug,Sentry等第三方监控神器,当然你完全可以自己定制一套符合实际情况的监控模型.一个监控系统大致可以分为四个阶段:日志采集.日志存储.统计与分析.报告和警告.下面主要从几个方面谈谈我对前端代码异常监控的一些理解. 二.JS异处理 脚本错误一般分为两种:语法错误,运行时错误.常见的处理方式有: 2.1 try..catch 捕获 用

如何制作响应式网站?12个优秀案例参考

响应的网页设计方法让你的网站对移动设备更加友好.网站开发者们采用最新的 HTML5 和 CSS3 技术以及最新的编码标准来制作响应式网站.响应式设计使网页设计更加强大,更具互动性和更美观.响应网站的设计有许多特色,使开发人员和设计人员能够创建速度快,性能优越的应用程序和网站,并适合于所有设备. 您可能感兴趣的相关文章 15款帮助创建响应式布局的优秀前端框架 经典网页设计:无缝过渡的响应式设计案例 让你的网站瞬间变成响应式的3个简单步骤 经典网页设计:响应式设计的国外购物网站 推荐35个新鲜出炉的

前端代码异常日志收集与监控

在复杂的网络环境和浏览器环境下,自测.QA测试以及 Code Review 都是不够的,如果对页面稳定性和准确性要求较高,就必须有一套完善的代码异常监控体系,本文从前端代码异常监控的方法和问题着手,尽量全面地阐述错误日志收集各个阶段中可能遇到的阻碍和处理方案. ? 收集日志的方法 平时收集日志的手段,可以归类为两个方面,一个是逻辑中的错误判断,为主动判断:一个是利用语言给我们提供的捷径,暴力式获取错误信息,如 try..catch 和 window.onerror. 1. 主动判断 我们在一些运

自动化代码发布系统实现

日常运维问题 在我日常运维工作中,代码发布可能是最普遍的一项工作之一,尤其是网页代码的更新,碎片化发布需求非常频繁.在前期开发人员比较少时,还可以由自己来上服务器通过脚本来发布代码.但随着公司项目的增多,更多的开发人员加入到公司,发布代码需求开始增多,这就占用了我大部分时间,经常的被打断其它工作来发布代码,非常地不爽,然后开始想解决方法. 尝试解决问题 当然,发布代码肯定是运维的职责之一了,但频繁的发布导致运维大部分时间浪费在重复的操作上,非常的不值得.基于此,开始限制代码发布频率,要求把不是很

发布一个参考ssdb,用go实现的类似redis的高性能nosql:ledisdb

起因 ledisdb是一个参考ssdb,采用go实现,底层基于leveldb,类似redis的高性能nosql数据库,提供了kv,list,hash以及zset数据结构的支持. 我们现在的应用极大的依赖redis,但随着我们用户量越来越大,redis的内存越来越不够用,并且replication可能还会导致超时问题.虽然后续我们可以通过添加多台机器来解决,但是在现有机器配置下面,我们仍希望单台机器承载更多的用户.另外,因为业务的特性,我们其实并不需要将所有的数据放到内存,只需要存放当前活跃用户.

【转载】【grunt整合版】30分钟学会使用grunt打包前端代码

[grunt整合版]30分钟学会使用grunt打包前端代码 grunt 是一套前端自动化工具,一个基于nodeJs的命令行工具,一般用于:① 压缩文件② 合并文件③ 简单语法检查 对于其他用法,我还不太清楚,我们这里简单介绍下grunt的压缩.合并文件,初学,有误请包涵 准备阶段 1.nodeJs环境 因为grunt是基于nodeJs的,所以首先各位需要安装nodeJS环境,这块我们便不管了http://www.cnblogs.com/yexiaochai/p/3527418.html 2.安装