前端架构学习，一些知识点记录(一)

最新推荐文章于 2024-12-10 14:50:18 发布
原创 最新推荐文章于 2024-12-10 14:50:18 发布 · 191 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#前端 #学习

本文探讨了服务端渲染(SSR)与客户端渲染(CSR)的概念，以超市购物为例，提及了Vite和Webpack在大型项目中的打包优化问题，以及使用影子DOM和WebComponents实现跨平台自定义标签的技术。同时，文章关注了PostCSS在兼容性和代码压缩中的应用，以及组件库设计的重要性和原则。
服务端和客户端渲染

SSR、CSR、例子，参考超市购物思想

vite webpack

vite script type===‘module’
webpack 先编译，大型项目打包慢

显示影子dom，浏览器设置打开

类似有视频标签，看不到一些操作按钮
attachShadow 构建影子dom
webComponents 跨平台 自定义标签

postcss

兼容性，代码压缩，单位换算

关注组件库的设计模式，设计文档，设计原则
基于JavaScript及Java、CSS、HTML的微服务架构学习设计源码
10-05
综合来看，这个源码库不仅覆盖了微服务架构学习的理论知识，更重要的是提供了一个实际操作的平台，使开发者能够通过实践深入理解微服务的架构设计、开发流程以及各个技术点的应用场景和实现方法。
关于前端的一些学习记录（1）
m0_61529679的博客
03-07 6038
只是一个大学生学习的随手记，会一点点更新，希望对共同进步的你有帮助！加油！
前端面试必备知识点总结
zzming的博客
03-08 6550
这篇博客是对前端面试所必须掌握的知识点的总结,并且这篇博客正在持续更新中… 1.JavaScript 基础 1.执行上下文/作用域/闭包 1.什么是执行上下文? 执行上下文是评估和执行JavaScript代码环境的抽象概念。每当JavaScript代码在运行时，他都是在执行上下文中运行。 执行上下文的类型 JavaScript共有三种执行上下文类型 全局执行上下文 这是基础的上下文,任何不在函数内部的代码都在全局上下文中.他会执行两件事:创建一个全局的window对象(浏览器环境的情况下),并且设
网站前端架构设计
leva的博客
10-09 3888
在原始开发的时候都会遇到以上问题，从这些问题中又发现了使用前端框架的重要性，有些人或多或少地接触过框架，但是对前端框架的认知还不够。大觅项目使用分层架构设计（把功能相似、抽象级别相近的实现进行分层，使逻辑变得清晰，容易理解和维护，也称作多层架构或N层架构），在这里使用的是类MVVM的分层架构方式，但还不完全是 MVVM 的分层架构方式。Visual Studio Code具备优秀的性能，完备的特性，加之针对于Web开发的优化和方便的调试，被评价为最好用的集成开发环境。首先看一下原始开发存在的以下问题。
了解微前端，深入前端架构的前世今生
moandaylab
08-08 1804
在我们的日常开发中，经常会遇到这么一些业务需求，比如说：在一个项目中要放入两个完全不同类型的场景。基于这样的背景下，单页面应用显然已经不能在繁杂的业务中脱颖而出。因此，前端的流行趋势里也就有了微前端架构。这篇文章更像是一篇笔记，记录了我学习微前端的伊始。那在这里，可能会谈到为什么我会从之前的应用文到突然学起了这些架构内容呢？原因在于，周一在入厂后接触到了一系列超级先进的技术。微前端可能是我第一天就触碰到的一个概念，在mentor的一番讲解之后，才对它有了个浅显的认识。......
前端基础学习笔记
sober30的博客
07-27 1万+
css3有哪些新特性：圆角盒子阴影文本阴影不透明度 ：opacity 、rgba渐变背景 ：线性渐变、径向渐变背景属性：backgroud-size、background-clip（拓展）结构选择器：first-child()…伪元素新写法 :before ::before(css3) 为了和:hover之类的伪类选择器作区分弹性盒子：flex转换：2D转换、3D转换（拓展）过渡：一般搭配hover使用animation动画（拓展）媒体查询。
一篇文章搞懂前端学习方法与构建知识体系
三钻 - 之前端到全栈之路
08-07 3855
给大家讲讲怎么样才是一个优秀的前端工程师，怎么做自己的职业规划，如何学习和构建知识体系。
Web前端个人知识总结
最新发布
tjywhswbdn1456的博客
12-10 2280
目录一、Web介绍二、前端开发技术1.HTML（超文本标记语言）2.CSS（层叠样式表）3.JavaScript4.jQuery：三、后端开发技术1.服务器端语言2.数据库3.网络协议四、Web安全Web（万维网）是一个广泛的信息系统，它彻底改变了人们获取和分享信息的方式。从技术层面来讲，Web 基于超文本传输协议（HTTP）。用户通过浏览器发送请求，服务器接收请求后返回相应的网页内容，这些内容主要是用 HTML（超文本标记语言）编写的。HTML 就像是建筑的蓝图，通过各种标签构建出网页的基本架构，如标题、
关于前端架构的过去、现在与未来
作一个独立连续的思考者
02-13 4662
早期的软件架构模式建立在有限的硬件功能上并尊重这一事实，然而，今天的情况已经变了。计算能力在不断提升，而软件架构印证了这种观点。本文从经典MVC说起，详尽解读了当代前端架构及下一阶段的展望。对于前端工程师，以及想从宏观层面理解现代Web应用程序架构的Web开发人员来说，均能从中获益。 软件架构的核心思想，就是推断软件系统各个组件之间数据流动的方式。 软件架构的质量取决于你设法推断这些数据流的...
web前端进阶架构师之路
m0_67537062的博客
03-26 5480
web前端架构师必学知识点，包含Vue、React、Electron、服务端渲染、微前端、前端性能优化、前端工程化、前端面试等方面的知识。
前端架构设计第一课 CI环境npm/Yarn
fegus的博客
05-19 7065
开篇词 像架构师一样思考，突破技术成长瓶颈 透过工程基建，架构有迹可循。你好，我是侯策（LucasHC），目前任职于某互联网独角兽公司，带领 6 条业务线前端团队，负责架构设计和核心开发、工程方案调研和选型，以及团队管理、人才梯队建设等工作。 从海外开启职业生涯、浸淫工匠般的 Coding 规范打磨，到深入国内一线大厂接受亿级流量的洗礼，我的工作方向始终没有离开前端开发。 前端开发是一个庞大的体系，纷杂的知识点铸成了一张信息密度极高的图谱。通过下面这张选自《Front-end Developer Hand
learn:记录学习总结的一个小仓库，构建自己的前端知识体系
05-12
前端面试之道 - 宋小菜，助你建立起完整的前端知识架构体系，探究知识的原理，深入了解大厂常考知识点 JavaScript 深入系列、JavaScript 专题系列、ES6 系列、React 系列 - 冴羽的博客 高级前端进阶博文 - 木易杨...
工作学习中遇到的Python问题和知识记录，包括自动化运维、前端学习、后端学习.zip
02-21
这个压缩包“工作学习中遇到的Python问题和知识记录，包括自动化运维、前端学习、后端学习.zip”包含了作者在这些领域中的实践经验和知识积累，下面将详细探讨其中可能涵盖的关键知识点。 首先，让我们关注自动化...
《产品前端架构》笔记（2）
04-11
在本《产品前端架构》笔记的第二部分中，作者西风潇潇对前端开发工程师在版本控制系统的知识进行了深入学习和记录。这部分内容涵盖了版本控制系统的概念、类型、优缺点、分支模型、工作流以及Git的介绍和使用方法。...
vue引用警告 "export 'default' (imported as 'url') was not found in './api/index'
热门推荐
十二的博客
05-08 2万+
vue引用警告 问题原因：ES6 编译器识别问题 修改 引用的main.js文件 将原来的 import Index_Utils from './api/index' 改为 import * as Index_Utils from './api/index'
eslint常见错误解决
十二的博客
03-15 1万+
error Unnecessarily quoted property '145' found quote-props 表示 key没必要加引号 Object properties must go on a new line if they aren't all on the same line 提示语法错误, 如果对象属性并非都位于同一行上，则它们必须位于新行上 error Trailing s...
error Unnecessary return statement no-useless-return
十二的博客
03-18 4823
因为 ESlint 插件导致return有误 在 return 后面加 false return false
error Missing space before function parentheses space-before-function-paren
十二的博客
05-24 4004
原因是函数名称或function关键字与开始参数之间缺少空格 可以在报错的当前页面检查哪里缺少空格 一般报错都会定位到多少行 修改.eslintrc.js的配置 在rules节点下增加"space-before-function-paren": 0 此rules还具有其他选项… { "space-before-function-paren": ["error", "always"], // or "space-before-function-paren": ["error
低版本360浏览器下，PDF.js部分文字显示不全的问题
十二的博客
11-02 3982
在低版本360极速模式下，使用 pdf.js 看pdf文件时，除了数字和符合，其它文字都不显示。 在其它浏览器显示是正常的。 此时，可以进行如下操作 打开360浏览器的设置 找到实验室 找到系统选项 勾选下图框选部分 然后重启浏览器。能解决文字显示不全的问题 ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值