这是一个创建于 1218 天前的主题，其中的信息可能已经有所发展或是发生改变。
目前在学前端，以为一直以为前端就是前端，现在深入了解之后发现其实前端也是部属在后端，就是前端所需的资源（代码 /样式 /资源）等都存储在后端的。只不过浏览器在打开的时候，从后端去获取信息再加载到浏览器中运行。
所以从这点来说，前端更加要注重性能：
1. 资源和数据要尽量小，方便快速传输加载。
2. 因为浏览器要开很多页面，所以前端资源应该尽早释放，要注重内存优化。
3. 前端已经不是单个静态网页，而是复杂的容器（可以做复杂的事情，比如 canvas，webgl ）。
不知道大型前端项目的代码量有多少（应该也大不到哪里去，跟后端比就是小虾米）?
前端对构建大型应用的可能性有多大？
所以从这点来说，前端更加要注重性能：
1. 资源和数据要尽量小，方便快速传输加载。
2. 因为浏览器要开很多页面，所以前端资源应该尽早释放，要注重内存优化。
3. 前端已经不是单个静态网页，而是复杂的容器（可以做复杂的事情，比如 canvas，webgl ）。
不知道大型前端项目的代码量有多少（应该也大不到哪里去，跟后端比就是小虾米）?
前端对构建大型应用的可能性有多大？
 |
1
murmur 2021-07-15 11:28:59 +08:00  1
前端优化只能砍需求，而这个几乎没法实现，懒加载你的首页还是一堆乱七八糟的，懒也懒不到哪里去
一个清爽的首页无论怎么做都很优化，堆旧淘宝那对乱七八糟的东西在首页，怎么优化首屏都下不来 |
 |
2
66beta 2021-07-15 11:40:01 +08:00
（应该也大不到哪里去，跟后端比就是小虾米）
|
 |
3
KisekiRemi 2021-07-15 11:50:29 +08:00 1
原本以为是面向用户体验进行开发，现在才明白是面向领导和公司开发
|
 |
4
rioshikelong121 2021-07-15 11:58:58 +08:00
现在一个 tab 随随便便占几百 MB 内存。吓人。
|
 |
5
CodeCodeStudy 2021-07-15 12:01:27 +08:00 1
第 2 点不成立，浏览器开很多页面跟前端的工作没有什么关系，只要当前页面不卡顿就行，过度优化没有用
|
 |
6
3dwelcome 2021-07-15 12:23:11 +08:00
“3. 前端已经不是单个静态网页，而是复杂的容器（可以做复杂的事情，比如 canvas，webgl ）。”
老外有句话：选最合适的语言，做最合适的事情。 JS 最好就是快速开发单页面应用，也别太在乎性能。你说搭建大型 webgl 应用，不是不可以，但对于 JS 来说，巨型项目代码管理压力真的还挺大。 |
 |
7
maplerecall 2021-07-15 12:29:17 +08:00 via Android
大型也得有个参照，举个例子，Bing 的前端部分代码 clone 下来大概 100 多 GB 。虽然包含了一些资源和测试文件，但其中无论整体框架还是业务代码的复杂度远超业界绝大部分后端项目了。
另外随着 node 应用越来越广泛，现在前端工作其实已经混合了不少之前属于后端的内容。不同项目的偏重性也都不一样，并不能武断的说前端代码量就一定小。例如工具、编辑器以及最近流行的 lowcode 类项目的前端代码量很多都远超后端部分的。 |
 |
8
James369 OP @maplerecall bing 前端是什么项目
|
 |
9
SergeGao 2021-07-15 14:51:46 +08:00
@maplerecall 好奇 Bing 前端都包括了什么？ 100GB 的前端项目还没见过。。
|
|
10
murmur 2021-07-15 14:55:25 +08:00
@maplerecall 因为 node 做后端就把后端强行算前端就没意思了，虽然大家都是全干，但是讨论的时候还是按浏览器和服务器划分
|
 |
11
ericgui 2021-07-15 14:58:37 +08:00
能做的事越复杂， 性能就越差
所以你只能做平衡，在满足公司业务的需求的同时，别太慢了，就行了。 |
 |
12
toesbieya 2021-07-15 15:54:06 +08:00
之前有看过有人说腾讯文档前端有上百万行代码
|
 |
13
godblessumilk 2021-07-15 16:05:15 +08:00 2
可以了解下 OHIF viewer 这个前端项目，一个在线的 DICOM 协议医疗图像查看器，涉及到了大量的 webGL 和 canvas 对二进制流的渲染以及图像处理，工程复杂度和代码量都远超常规小体积图像文本处理的后端，https://viewer.ohif.org/ 是个典型的 PWA 离线 web 应用，server worker 让 js 开了多线程提高性能
|
 |
14
a4854857 2021-07-15 16:34:25 +08:00
@godblessumilk 简单扫了一眼你的描述顺手打开还蛮吓人
|
 |
16
banricho 2021-07-15 18:59:42 +08:00 via Android
看方向，数据可视化、地图这种，或者石墨文档、Notion 这类都是比较复杂的前端业务。不要光看代码量，很多电商或管理后台只是页面多，但实际上难度并不大。
|
 |
17
DiamondYuan 2021-07-15 21:21:19 +08:00 via iPhone 4
推荐读 vscode 源码
1. 代码量大，有 50 万行 2. 用了大量设计模式，vscode 的开发者是 《设计模式》 这本书的作者。 3. 附带了 monaco，优秀的前端编辑器。（几乎所有 cloud ide 用的都是 monaco 4. 跨平台（ mac windows linux，跨端 （ node electron web，可以了解到如何通过依赖注入屏蔽环境差异，如何组织代码 5. 自带插件系统，可以学习如何设计一套优秀的插件 api，学习如何进行进程隔离。 6. 主题：学习如何实现动态换肤 7. 语言服务(lap): 这个不做编辑器可以不看 8. src/vs/base 包含一系列基础库，可以拷贝到自己心目里直接用 |
 |
18
blessyou 2021-07-15 21:33:11 +08:00 via Android 1
等一等，优化的前提是有监控或者数据对比。没有就只能瞎吹。
|
|
19
DiamondYuan 2021-07-15 21:37:04 +08:00 via iPhone
除了 vscode，还可以看 chrome 的 devtool （没错，这个是前端项目）。
|
 |
20
yunyuyuan 2021-07-16 09:42:54 +08:00
优化是用来面试的
|
 |
22
MrBrand 2021-07-16 15:02:20 +08:00
@KisekiRemi 面向业务开发，哈哈哈哈
|
 |
23
janus77 2021-07-16 21:28:51 +08:00
imququ.com 看看这位前端大佬的博客 你就知道怎么优化了
注意：不止看文章 这个站本身的打开速度也是顶级的 |
Select Language