Vuevue + koa2 + webpack4 实现服务端渲染
完整代码地址： https://github.com/dirkhe1051931999/vue-ssr-template demo 地址： https://github.com/dirkhe1051931999/common-demo/tree/master/vue-ssr-demo 服务端渲染、SPA、同构 服务端渲染：后端不仅仅进行数据的获取处理，而且也服务页面生成，最终传给客户端（浏览器）是…
标签CSS共匹配13条公开文章。
文章![vue + koa2 + webpack4 实现服务端渲染]()
文章![你一定要经历的 web 页面性能优化之旅 · 08]()
性能优化你一定要经历的 web 页面性能优化之旅 · 08
WebP 相对于 PNG、JPG 有什么优势？--- https://www.zhihu.com/question/27201061 webp 的兼容写法 安卓支持 webp，ios 不支持 webp --- https://caniuse.com/#search=webp ios 下要使用 webp 可以导入下面的库 webpjs--- https://github.com/obartra/we…
文章![你一定要经历的 web 页面性能优化之旅 · 07]()
性能优化你一定要经历的 web 页面性能优化之旅 · 07
PWA：渐进式网页应用程序；关键技术：Service Worker、Manifest 、Push Notification；直观上的体现：无网络的时间，可以立即加载出数据和页面 这次主要实践 Service Worker Service Worker Service Worker(SW)是一个离线缓存文件，SW 作用于浏览器与服务器之间，可以理解为一个代理服务器 具体的 Service Worke…
文章![你一定要经历的 web 页面性能优化之旅 · 05]()
性能优化你一定要经历的 web 页面性能优化之旅 · 05
上图是用户监测性能模型的不同阶段，可以看出，页面加载被定义成很多个阶段，每一个阶段都对应有 Performance Timing 页面性能指标 :衡量网络链路和服务器响应性能时间 :带宽时间 :打开页面开始到页面开始有东西呈现的时间（TTFB+HTML 下载时间+头部资源加载时间） 公式 页面开始渲染的时间点-页面开始请求时间点 如何获取 (chrome.loadTimes().firstPain…
文章![你一定要经历的 web 页面性能优化之旅 · 03]()
性能优化你一定要经历的 web 页面性能优化之旅 · 03
，涵盖的知识面非常广，如果只是死记硬背，根本无法理解其中的流程与原理，我学习的方式是，先整体明白有哪些流程，然后逐个流程慢慢理解 整体过程 浏览器缓存 彻底理解浏览器的缓存机制 DNS 解析 DNS 域名解析 TCP 链接 TCP 连接 HTTP 请求与响应 HTTP 请求与响应 浏览器解析渲染页面 浏览器自上而下逐行解析 HTML、词法分析、语法分析、构建 DOM 树 当遇到 CSS 外链时，主…
文章![BFC 与 FFC]()
CSSBFC 与 FFC
此文是 flex 学习的回忆与补充， 源码地址 BFC 和 FFC 是什么 css 布局的各种 FC 简单介绍：BFC，IFC，GFC，FFC 一文中详细的讲解了 BFC 和 FFC 的概念与区别，总结起来为以下几点 ，格式化上下文，渲染区域的渲染规则会决定子元素的排列 ，块级格式化上下文，1、内部的 box 垂直方向紧挨着；2、内部两个相邻的 box margin 会重叠，3、BFC 不会和 f…
文章![rem 布局原理]()
CSSrem 布局原理
em 是什么 em 是相对单位， 在 font-size 中使用 em， 代表相对父元素字体大小， 在其他属性中使用 em， 意味着相对当前选择器字体大小 em 的题 问：s1 s1 s5 s6 的 font-size 各是多少？答案在底部 rem 是什么 rem 作为非根元素时， 相对于根元素大小 rem 的本质是基于宽度的等比缩放， 一般使用 js 来设置 弹性布局与响应式布局 弹性布局是响应…
文章![keep-alive]()
Vuekeep-alive
keep-alive 是什么 keep-alive 是 vue 的内置组件，它自身不会渲染成一个 DOM，也不会出现在父组件链中， 使用 keep-alive 包裹的组件会有 和 两个事件；activated：组件激活时调用，deactivated：组件停用时调用，这两个钩子在服务器端渲染期间不被调用 不使用 keep-alive：生命周期钩子(beforeRouteEnter --> creat…
文章![z-index 层叠规则]()
CSSz-index 层叠规则
如果对 z-index（层叠样式表）是什么还不太自信，可以看 MDN 使用 z-index 常见的问题 为什么我设置了 z-index:9999，或者 z-index:-9999，但是没生效 设置了定位属性，也设置 float 属性，怎么 z-index 就出问题了 z-index:0,z-index:1,z-index auto 有什么区别 定义一些概念 定位元素：设置了 position：re…
文章![vue-cli3 的配置文件详细介绍]()
Vuevue-cli3 的配置文件详细介绍
如何启动 操作步骤 一开始只有两个选项: default(默认配置)、Manually select features(手动配置)和自定义模板，根据自己情况选择 根据你的项目需要来选择配置,空格键是选中与取消，A 键是全选 选择 css 预处理器 如果你选择了 Css 预处理器选项，会让你选择这个 是否使用路由的 history 模式：一般选择 no 选择 Eslint 代码验证规则：不勾这个->…
确认评论邮箱
邀请制评论