# 学习了下前端的一些概念 **URL:** \ **Category:** 软件经验交流展望\ **Created:** [2022 年10 月 29 日 03:08 UTC](https://forum.freemdict.com/t/topic/16630 "2022-10-29T03:08:26Z")\ **Posts on this page:** 20\ **Page:** 1
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 03:08 UTC](https://forum.freemdict.com/t/topic/16630/1 "2022-10-29T03:08:26Z")
很多国外网站明明没被强却经常打不开，比如 Github，甚至 Stackoverflow 有时也不太正常。大概就是因为网页上的JS引用库的来源网站被强了吧，可是为什么有时能顺利打开有时又不行，难道强还有茶歇或下班的时候，百思不得其解。请专家有空的话给解惑解惑，谢谢！ [六个基本概念：Library，Toolkit，Framework，Design，Boilerplate，Scaffolding](https://www.zhihu.com/question/304757674) ---
作者： ![舒服员](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/%E8%88%92/13edae/32.png) [@舒服员](https://forum.freemdict.com/u/%E8%88%92%E6%9C%8D%E5%91%98)\ 发布日期： [2022 年10 月 29 日 03:16 UTC](https://forum.freemdict.com/t/topic/16630/2 "2022-10-29T03:16:51Z")
强确实是有松紧的，比如开会的时候紧。 不过，主要原因是这些网站都使用了CDN。 网上有些工具可以测试网站在不同地区的连通性。把那些绿的地区使用的IP复制到host里，就可以访问了。 这就是改hosts法。 还有一种方法是在浏览器里安装资源替换扩展。 把那些国外的库文件替换成国内的版本。 当然最好的方法 直接全局代理 ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 03:20 UTC](https://forum.freemdict.com/t/topic/16630/3 "2022-10-29T03:20:04Z")
> [@舒服员](#): > > 主要原因是这些网站都使用了CDN。 哦，好像明白了，就是说那些库的来源会有很多镜像或者IP是动态变化的，强的更新会有些滞后。谢谢！ ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 03:23 UTC](https://forum.freemdict.com/t/topic/16630/4 "2022-10-29T03:23:36Z")
那国内的网站如果在前端设计中引用了那些库，岂不是也有被强的问题？这又是如何解决的呢？是不是在网页中可以指定国内可用的库版本？如果国内可以指定，那Github那样的网站为何不针对国内的访问请求也指定相应可用的库来源？ ---
作者： ![last\_idol](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/last_idol/32/2205_2.png) [@last\_idol](https://forum.freemdict.com/u/last_idol)\ 发布日期： [2022 年10 月 29 日 03:39 UTC](https://forum.freemdict.com/t/topic/16630/5 "2022-10-29T03:39:04Z")
CDN的服务器要离用户越近越好，访问差打不开自然是因为服务器不在国内，国内有很多代替品的。 > **[字节跳动静态资源公共库](https://cdn.bytedance.com/)** > > 字节跳动静态资源库支持多协议、资源动态拼接、快速检索及资源的动态更新,安全、稳定、实时。 ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 03:44 UTC](https://forum.freemdict.com/t/topic/16630/6 "2022-10-29T03:44:09Z")
这里面的道道还挺多的 ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 03:56 UTC](https://forum.freemdict.com/t/topic/16630/8 "2022-10-29T03:56:56Z")
> [@舒服员](#): > > 还有一种方法是在浏览器里安装资源替换扩展 看贴不仔细，不好意思 ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 04:15 UTC](https://forum.freemdict.com/t/topic/16630/9 "2022-10-29T04:15:01Z")
还是有个疑问，浏览器中为什么不能集成一些常用的前端的库，或者象编码用的IDE那样可以下载一些标准库，这样岂不是可以免去很多的麻烦？ ---
作者： ![AnLuoRidge](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/anluoridge/32/35936_2.png) [@AnLuoRidge](https://forum.freemdict.com/u/AnLuoRidge)\ 发布日期： [2022 年10 月 29 日 04:38 UTC](https://forum.freemdict.com/t/topic/16630/10 "2022-10-29T04:38:00Z")
因为这不是浏览器的职责，并且如果真集成了会造成更多的麻烦。 这方面早有插件，比如 [LocalCDN](https://chrome.google.com/webstore/detail/localcdn/njdfdhgcmkocbgbhcioffdbicglldapd)，但用着用着你就会发现它会出现什么问题。比如，一个网站声称自己用了 jQuery 的 A 版本，插件发现这版本我有啊，就不从该网站/CDN下载 jQuery 了。殊不知，这个 A 版本在插件里和 CDN 的可能不一样，或者这个所谓的 A 版本经过了该网站的魔改，仅仅保留了名字未变。要想正常加载该网站，就必须下载它网页中要求的 jQuery。 其他还会有各种各样的问题，总的来说，是因为前端很多东西都不是标准化的，而 CDN 这个解决方案足够好。并且浏览器其实很聪明，它会根据规则缓存一些库的，只不过都有有效期。 ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 05:02 UTC](https://forum.freemdict.com/t/topic/16630/11 "2022-10-29T05:02:17Z")
> [@AnLuoRidge](#): > > 这方面早有插件，比如 [LocalCDN](https://chrome.google.com/webstore/detail/localcdn/njdfdhgcmkocbgbhcioffdbicglldapd)，但用着用着你就会发现它会出现什么问题 这个问题再大我也得试试，比天天上网肠梗阻好，谢谢！ ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 05:20 UTC](https://forum.freemdict.com/t/topic/16630/12 "2022-10-29T05:20:04Z")
有一点不解，为什么要强这些标准库呢？库里难道会藏细菌？BAT不是都在用吗？ ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 05:41 UTC](https://forum.freemdict.com/t/topic/16630/13 "2022-10-29T05:41:55Z")
有没有这样一种做法，我的网站把我用到的前端库在我自己的服务器上装一份，然后就从我自己的服务器上调用？ ---
作者： ![舒服员](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/%E8%88%92/13edae/32.png) [@舒服员](https://forum.freemdict.com/u/%E8%88%92%E6%9C%8D%E5%91%98)\ 发布日期： [2022 年10 月 29 日 08:45 UTC](https://forum.freemdict.com/t/topic/16630/14 "2022-10-29T08:45:03Z")
你的做法就是传统做法啊, 传统网站就是把所有资源都在自己服务器上托管. 它也不是强这些库, 是强云服务商和CDN服务商的服务器, 这些服务商有个服务, 就是免费托管这些开源前端库, 甚至说你把库写好传到npm后, 自动就被托管了. 比如你说你的网站有一个JS文件负责给汉字加拼音, 这文件你当然可以放自己服务器上, 但你也可以做成一个包发布到npm(就是一个仓库), 然后你就可以在一些cdn服务商那里发现这个包被托管了, 比如 > **[UNPKG](https://unpkg.com/)** > > The CDN for everything on npm 你就可以在自己网站用这样的方式`unpkg.com/my_pinyin.min.js` 引用这个文件, 这样你就节省了自己服务器的流量, 同时让用户享受到强大的CDN加速. 整个过程是全自动的, 无需人工操作, 只要你把包传到npm就可以了. 当然, 你可能觉得, 有的文件不适合开源, 也不想发布到npm. 但是现在开发项目都会使用大量的开源框架, 开源库. 当然了, 由于强的存在, 这项便利不但没有了, 还成了麻烦. ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 09:08 UTC](https://forum.freemdict.com/t/topic/16630/15 "2022-10-29T09:08:19Z")
老兄的讲解十分透彻，解了我多年的疑惑，谢谢！ ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 09:34 UTC](https://forum.freemdict.com/t/topic/16630/16 "2022-10-29T09:34:55Z")
再请教下，假如我在编写mdx释义的过程中引用了Vue这个库，但又不想查个字典还要联网去访问CDN，是不是有一个有点像“编译”的机制，可以把库里仅仅被用到的那一小部分提取出来以便我附在mdx或mdd文件中？ （今天追问有点多，不好意思） ---
作者： ![AnLuoRidge](https://forumcdn.freemdict.com/user_avatar/forum.freemdict.com/anluoridge/32/35936_2.png) [@AnLuoRidge](https://forum.freemdict.com/u/AnLuoRidge)\ 发布日期： [2022 年10 月 29 日 10:20 UTC](https://forum.freemdict.com/t/topic/16630/17 "2022-10-29T10:20:31Z")
> [@surfactant](#): > > 是不是有一个有点像“编译”的机制 有。 要实现的话，这个问题会涉及到 **现代前端** 复杂的部分 – toolchain。以 webpack 为例，如果你引用的库支持 tree shaking，那么打包时就会自动舍去程序中未使用的库代码。 ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 11:30 UTC](https://forum.freemdict.com/t/topic/16630/18 "2022-10-29T11:30:48Z")
看来搞复杂了，谢谢解答！ ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 11:46 UTC](https://forum.freemdict.com/t/topic/16630/19 "2022-10-29T11:46:17Z")
> [@AnLuoRidge](#): > > 这方面早有插件，比如 [LocalCDN](https://chrome.google.com/webstore/detail/localcdn/njdfdhgcmkocbgbhcioffdbicglldapd) 开了这个后很多网站都顺畅多了，真不错！ ![image](https://forumcdn.freemdict.com/uploads/default/original/3X/6/1/61676ccb407e10201308af1ec5f4ff7ca0537f1e.png) ---
作者： ![舒服员](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/%E8%88%92/13edae/32.png) [@舒服员](https://forum.freemdict.com/u/%E8%88%92%E6%9C%8D%E5%91%98)\ 发布日期： [2022 年10 月 29 日 13:32 UTC](https://forum.freemdict.com/t/topic/16630/20 "2022-10-29T13:32:20Z")
那些库就是js文件而已, 可以直接下载到本地用, 比如js的桌面开发框架electron, 可以使用vue什么的, 不需要联网. 至于你说的提取一部分, 这个是网站上用时, 网络环境嘛, 为了减小传输的文件体积(影响网页加载速度), 会用打包工具webpack之类的把用到的部分提取出来, 不用的代码去掉. 如果是本地用, “提取”(打包和treeshaking)的用处不是特别大, 也就节省几M, 少用一张图片一个视频就出来了. ---
作者： ![surfactant](https://forumcdn.freemdict.com/letter_avatar_proxy/v4/letter/s/dbc845/32.png) [@surfactant](https://forum.freemdict.com/u/surfactant)\ 发布日期： [2022 年10 月 29 日 13:51 UTC](https://forum.freemdict.com/t/topic/16630/21 "2022-10-29T13:51:06Z")
明白了，谢谢！ [下一页](https://forum.freemdict.com/t/topic/16630.md?page=2)