推广 热搜: csgo  vue  2023  angelababy  gps  信用卡  新车  htc  落地  控制 

【技术浅谈】JavaScript 代码压缩服务 Google Closure C

   2023-08-06 网络整理佚名2140
核心提示:服务,介绍它比起其它代码压缩工具的优势,并结合实例说明其基本的使用方法与技巧。因此,我们大可以在开发时正常书写代码,仅在发布时(把代码放到网站上的时候)对其进行压缩。我们可以参考原版的代码实现高效开发,而在实际的页面上使用压缩版本。这是因为后端的代码只需要由服务器执行,不需要发送给用户。环境开发服务器,服务器代码也没有必要压缩。但如今的动态网页开发,使用到的客户端代码越来越多。代码压缩服务。

是新朋友吗? 记得点击蓝字关注我哦~

上一讲,我们讲解了《高级教学文案11-NLP》的基础知识。 已经有点陌生的朋友可以参考之前的讲义:

本期我们将介绍使用代码压缩服务的基础知识。

同学们好,在网页前端的开发过程中,压缩代表代码是一个容易被忽视但又非常重要的环节。 然而,有多种服务提供此功能,其中许多服务的配置和使用都非常耗时。 本文推荐的服务,介绍其相对于其他代码压缩工具的优势,并通过示例说明其基本使用方法和技巧。

注:本文假设读者已掌握以下知识:HTML和HTTP请求的基本概念和语法; HTTP 请求的基本概念。

为什么要进行代码压缩?

代码压缩是指重写一种语言的源代码,使其在能够实现原有功能的同时占用更少的空间(更少的字符)。 最简单的压缩方法是删除代码中多余的空白字符(换行符、空格和制表符)和注释。 例如下面这段代码:

我们只需删除空格和注释即可获得压缩版本:

这段代码的功能和之前的没有什么不同。 实践中,对于大型网站的代码,仅这一步就可以减少40%到50%的代码量。 我们可以更进一步,例如,将长变量和函数名称更改为较短的名称:

当然,这种做法会大大降低代码的可读性。 但可读性最重要的作用是维持代码维护和开发的效率。 因此,我们可以在开发时正常编写代码,只在发布时(将代码放在网站上时)缩小。 事实上,大多数框架或库在发布代码时都会提供带注释的原始版本和缩小版本(通常命名为***.min.js)。 我们可以参考原始代码来实现高效开发,并在实际页面上使用压缩版本。

值得注意的是,我们需要压缩的主要是前端代码。 这是因为后端的代码只需要服务器执行,不需要发送给用户。 也就是说,即使你的网站使用Node.js这样的环境来开发服务器,服务器代码也不需要精简。 仅应缩小 HTML 页面加载使用的代码。

代码压缩的重要性

那么,减少代码大小有什么实际意义呢? 显然,最重要的效果是减少了服务器发送给客户端的数据量。 页面加载速度的瓶颈往往是网络通信速度。 很多时候,网页的加载速度直接取决于用户的网络连接状况,会出现很大的波动。 此时,可以以更短的时间和更少的次数来传输压缩码。

可能有人认为代码的数据量比图片、视频等资源文件小很多,代码的传输时间不会对用户体验产生明显的影响。 诚然,加载一个视频可能需要几十秒,但传输代码只需要几秒钟,但前端开发重点关注的恰恰是这种精确到毫秒的细节。 页面加载时间的微小差异可能会对用户体验产生很大影响。 根据顶级市场分析师 Neil Patel 的调查显示,页面延迟仅 1 秒就会导致 7% 的用户流失,而当延迟增加到 4 秒时,这一比例将超过 25%。 同时调查还显示,移动用户最关​​心的网页问题是页面加载速度(超过73%的用户关注此问题),远远超过其他问题的比例,例如页面错误(51%)或视觉设计不合理(48%)。 可见,在加载速度上力求精益求精,甚至“每一分钱都比较”,是有效的、值得的。

同时,减少代码大小不仅会减少页面的总加载时间,还能有效减少页面的初始响应时间(Time To First Byte,TTFB)。 首次响应时间是从用户访问网页到页面开始加载所花费的时间。 传统的静态网页加载中,在执行脚本之前只需通过HTML即可加载网页,因此代码的传输时间并不是那么重要。 但当今的动态 Web 开发使用越来越多的客户端代码。 大多数依赖前端框架的网页在完整代码下载完成之前甚至根本无法加载,代码压缩的作用逐渐变得不可忽视。

打开页面后,很多用户可能愿意花时间等待图片和视频加载,但这种耐心只有在看到页面本身的部分内容后才能有。 想象这样一个场景:当访问A网站的页面时,页面的主要内容会立即显示出来,但一些图片、视频等内容需要等待几秒钟才能完全显示; 点击B网站的链接后,会显示几秒钟的空白页面,但页面加载后所有图像和视频都会出现。 哪个页面更容易让用户耐心等待? 在当今快节奏的互联网社会,大多数用户关心的是第一时间获取有效信息:在图片和视频加载之前,用户更愿意从文本中提前获取信息,而不是无所事事地等待。 如果总体加载时间相差不大,那么能够像站点 A 一样快速提供反馈将是保持客户参与度的关键。 代码压缩是提高反馈速度的有效且廉价的方法。

最后,代码压缩降低了代码的可读性,这也可以在一定程度上降低代码被解释和抄袭的风险。

它是推出的代码压缩服务。 与现有其他服务相比,主要具有以下优势:

1.利用提供的HTTP API,无需下载安装任何程序即可使用其全部功能(但也提供了终端版本供离线使用)。

2.配置比较简单。 大多数其他压缩工具需要手动调整每个压缩选项以达到合适的压缩率,但在设置了 、 和 NS 三种压缩级别后,您只需选择其中之一即可,无需一一配置细节。

3. NS级别具有极高的压缩比。 对大型网站的代码进行压缩时,大部分代码可以减少70%到80%,而一般软件只能减少50%左右。

下表比较了其他几种常见压缩工具在压缩真实代码时的压缩效率。 原代码为3.6.4的源代码,大小为292,458字节:

其实,如果你只是想体验一下效果,只需要访问这个页面,在页面左侧的文本框中输入代码,就可以立即看到压缩效果:

但直接使用该页面延迟比较大,而且在高压缩级别压缩大型文件时很容易出现超时错误。 因此,建议使用提供的HTTP POST API手动发送HTTP请求来使用该服务。

 
标签: 代码压缩
反对 0举报 0 收藏 0 打赏 0评论 0
 
更多>同类资讯
推荐图文
推荐资讯
点击排行
网站首页  |  关于我们  |  联系方式  |  使用协议  |  版权隐私  |  网站地图  |  排名推广  |  广告服务  |  积分换礼  |  网站留言  |  RSS订阅  |  违规举报
Powered By DESTOON