- 博客(14)
- 收藏
- 关注
RSS订阅翻译 图片压缩的正确打开方式
图片压缩的正确打开方式图像通常占据了页面大小的绝大部分，并且占据的绝大部分视觉空间。因此,优化图片通常会节省大量字节数和提升性能：浏览器下载的字节数越少，客户端带宽的争抢越少，浏览器的下载和屏幕加载内容速度越快。图像优化既是一门艺术，也是一门科学：说它是一门艺术是因为对于如何最好地压缩单个图像并没有一个明确的答案;而说它是一门科学，则是因为有许多成熟的技术和算法可以显著地缩小图像的大小。给图像设置最佳配置需要仔细分析多个维度：格式所具备的能力、编码的内容、质量、像素维度等等。优化矢量图所有现代浏览器
2020-10-20 23:14:50
701
1
翻译 Fast load times系列翻译——将性能预算合并到构建过程中
将性能预算合并到构建过程中在你定义了性能预算之后，就应该开始在程序中实施并追踪它了。有许多工具可以帮助你设置性能预算，并且在程序超出预算时发出警告。我们现在要做的就是去了解如何选择最适合你的需求的产品。????️♀️使用 Lighthouse 性能预算Lighthouse是一个查看性能的辅助工具，它可以在几个关键领域测试网站的性能、可访问性、最佳实践以及网站作为渐进式网页应用（PWA）的表现如何。Lighthouse 的命令行版本(v5+)支持基于资源大小资源数量的性能预算。您可以为下
2020-10-17 23:37:11
220
翻译 Fast load times系列翻译——选择正确的图片格式
选择正确的图片格式看到这个标题，你需要先自问一下，一张图片是否真的达到了预期的效果？一个好的设计就是简单，而且总能拥有最好的性能。你可以去尽量除掉图片资源，因为相对于页面上的 HTML、CSS、JavaScript 或其他资源，图片通常占据了更大的字节，所以尽量要去除掉每一个图片资源，这永远是最好的优化策略。但是，一张合适位置的图片传达的信息比千言万语都要多，所以我们需要找到它们之间的平衡点。所以，我们要开始考虑，是否存在另一种可以更有效地达到预期结果的技术：使用CSS（例如阴影或渐变）和 CSS
2020-10-15 23:22:21
264
翻译 Fast load times系列翻译——性能预算 101
性能预算 101性能与用户体验的重要组成部分，这也是业务指标的一部分。我们都认为，如果是一名优秀的程序员，都是以开发一个优秀性能的站点为目标，但是事实上很少人能做到。和大多数事情一样，要实现一个目标，你必须先去清晰地定义它，这可以从设置一个性能预算开始。定义**性能预算就是对影响站点性能的各种指标施加一组限制。它可以是页面的总体积，可以是移动页面网络加载速度，甚至是发送 HTTP 请求的数量。它可以作为设计、技术和决策的参考点。有了预算，设计师就可以衡量高分辨率图像的效果以及他们选择的 web fo
2020-10-15 23:19:16
186
翻译 Fast load times系列翻译——为什么速度很重要
为什么速度很重要消费者越来越依赖手机来获取数字化信息和服务，如果你查看了你的站点分析，你可能会在你自己的站点数据中看到这个问题：用户的要求越来越高，当他们衡量你是站点时，他们不仅仅只和你的竞争对手比较，还会和他们每天感受到的最佳体验的网站来进行比较。这篇文章总结了一些性能和成功的业务之间的关联。性能是留住用户的关键性能直接影响了公司的下限！性能在成功的创业公司中扮演了重要角色，高性能的站点更能吸引和留存用户。Pinterest（一个站点） 减少了 40% 的加载等待时间，搜索引擎流量增加了
2020-10-15 23:16:43
223
翻译 Fast load times系列翻译——什么是“速度”
什么是“速度”我们已经知道“速度”很重要，那么什么是“速度”呢？拥有一个能够快速访问的站点意味着什么？我们经常能够听到别人说他们的网站加载时间是 x.xx 秒。但是，“加载”并不是单一的，没有一个单一指标能完全地描述它。在加载过程中有多个不同的时间段会影响到用户认为它是否“快”，如果你只专注于其中一段，那在其他的时间里可能会有糟糕的体验。你不应该只使用一个衡量指标，而是对影响用户体验过程中的每一段时间分别进行计时。当一个用户访问了 web 页面，它们通常是在寻找某种类型的反馈：传统的性能指标，比如
2020-10-15 23:14:42
187
翻译 Fast load times系列翻译——使用 RAIL 模型来衡量性能
使用 RAIL 模型来衡量性能RAIL 是一个 以用户为中心 的性能模型，它提供了一个如何思考性能的体系。该模型将用户体验分解为关键操作（例如：点击、滚动、加载）并帮助你为它们定义性能指标。RAIL代表web应用程序生命周期的四个不同方面：响应、动画、闲置、加载（response, animation, idle, load）。用户对每种操作都有不同的性能期望，因此性能指标是[根据内容和用户如何感知延迟的UX（user Experience:用户体验）来定义的](UX research on how u
2020-10-15 23:12:22
404
翻译 Fast load times系列翻译——如何保持性能
如何保持性能我们能发现性能经常会发生退化，这是因为性能优化就像是健身：仅仅付出一次努力是不够的；你必须改变自己的生活方式。谷歌内部研究发现：40%的网站性能会在 6 个月后退化。性能预算是解决这个问题的一个方法。性能预算就是对影响站点性能的指标的一组限制。从本质上类似于财务预算：设置一个阈值并保证自己在这阈值之内。总得来说，一个好的性能预算总是结合了不同类型的度量标准，例如，产品页面的性能预算可能如下：环境条件限制在慢速 3G 上互动少于5 秒在快算 3G 上互动
2020-10-15 23:09:04
176
翻译 Fast load times翻译开篇
Fast load times用于提升网站性能的技术导读当你开始构建现代 web 站点时，如果你想保证站点的性能，测量、优化和监控是很重要的事情。性能在任何线上企业中都扮演着重要角色，一个高性能的网站永远比低性能的网站更能吸引留住用户。网站优化应该以用户体验为中心，像 Lighthouse 这样的工具（Chrome 提供的工具）能够高亮这些指标并且帮助你一步步提升你的站点性能。为了保证站点性能够持久高效，设置“性能预算”（在一定指标内），来帮助你的团队在有约束的范围内工作，并能够保持性能高效和用户满
2020-10-15 23:05:23
162
原创 手把手教你实现一个简单的基于token的自动登录（axios+node）
手把手教你实现一个简单的基于token的自动登录（axios+node）前言自动登录是现在大多数app的基本需求，可以让用户跳过繁琐的登录过程，提升用户体验，但是对于初学者而言，自动登录不是特别好理解，接下来我们就讲讲如何实现自动登录基本概念先来理清如何自动登录的逻辑。用户第一次登录时，后端接收到用户账号和密码，经过复杂的加密（md5）后，设置一些参数后（过期时间等）返回一串tok...
2019-10-31 20:09:07
2229
原创 JS 前端常见的攻击
前端安全问题一直是面试经常问到的问题，也是我们平时建站会遇到的问题，今天来记录一下前端安全方面的相关知识。前端经常遇到的攻击有XSS CSRF 网络劫持 控制台注入XSS攻击（跨站脚本攻击）问题：简单来说，XSS指的就是代码注入，它利用的是html的一些漏洞来进行注入脚本，比如插入一个script标签<script>,或者直接进行页面弹窗，更有可能通过你的inp...
2019-04-10 16:09:45
2693
原创 JS encodeURI和encodeURIComponent()方法的使用
在我们平时的开发中，经常会出现一些无效的URI，什么是无效的URI呢？比如说包含空格，冒号，等号等，会影响解析。这时候我们就需要encodeURI或者encodeURIComponent()方法出动了。encodeURI会替换所有的字符，但不包括以下字符，即使它们具有适当的UTF-8转义序列：类型 包含 保留字符 ;,/?:@&=+$ 非转义...
2019-03-10 17:30:25
4053
原创 如何使用git和使用码云最详细教程
git的使用是在团队开发时必不可少的一项技能，那么我们如何使用git呢？1.安装githttps://git-scm.com/download/win前往下载地址下载，无脑安装安装完毕后，在桌面点击右键。会多出git bash here 和 git gui here两个选项，点击bash here输入git --version 可以测试是否安装成功2.获...
2019-02-20 17:40:34
2087
转载 安装Windows 64 位 mysql 最新版本解压包中没有data目录和my-default.ini及服务无法启动的快速解决办法
转载于：https://blog.csdn.net/ken1583096683/article/details/79874211和：http://www.jb51.net/article/135905.htm和：http://www.cnblogs.com/yyhh/p/5062153.htmlmysql官网下载地址：https://dev.mysql.com/downloads...
2018-04-15 14:39:55
9743
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人