
前端
文章平均质量分 72
JackieZhengChina
70'码农,优快云博客专家,信息系统项目管理师,工商管理硕士,CZB政采评审专家,中国采购与招标专家库专家,自驾爱好者,近20年教育类产品研发及管理经历,曾任教育科技公司联合创始人兼产品VP、科技公司产研VP。
职业标签:产品、项目、技术、运营、管理、战略。
展开
-
推荐一个开源高颜值全能视频播放器
它不仅颜值在线,而且性能优异,完美符合现代网站的需求。特别是在做公司官网项目时,同事们都抱怨说找不到一款既美观又实用的播放器,让整个开发进度都受到了影响。可是在挑选视频播放器时,存在各种各样的问题,要么界面太过简陋,要么广告满天飞,要么就是加载特别慢。它不仅提升了网站的档次,更让访客停留时间明显增加。通过使用 Plyr,我的网站视频播放体验得到了质的提升。现代简约风:采用极简设计语言,观感清爽,不会喧宾夺主。弹幕系统:支持添加弹幕互动,让视频更有趣。热键支持:支持键盘快捷操作,使用更便捷。原创 2025-01-11 22:05:50 · 248 阅读 · 0 评论 -
前端日志打印规范
通过以上步骤,我们可以建立一个前端项目的日志输出规范。一个好的日志系统应该是灵活的,能够根据不同的环境和需求进行适当的调整。日志是帮助我们更好地理解和维护应用的工具,合理的使用和管理日志对于任何规模的前端项目都是非常重要的。作者:南城FE https://juejin.cn/post/7355321162530914338。原创 2024-07-29 08:49:21 · 522 阅读 · 0 评论 -
随手写个插件:禁止浏览器自动输入/补全验证码
【代码】禁止浏览器自动输入/补全验证码。原创 2024-07-09 11:03:19 · 168 阅读 · 0 评论 -
分享 12 个 JavaScript 动画库增强用户体验
无论你是操纵 HTML 或 SVG DOM 元素,还是创建具有独特功能的独特 Mo.js 对象,这个可靠且经过充分测试的库都经过 1500 多项测试的支持,在 GitHub 上拥有超过 1700 颗星。它是 Anime.js 的一个引人注目的替代品,它提供了一个强大的解决方案来增强你的动画工作。从滚动动画到手写效果和 SPA 页面过渡,这些库增添了独特的美感,提高了参与度,并留下了令人难忘的第一印象。其人性化的设计、对 GitHub 的零依赖以及超过 2100 位用户的认可,使其成为迷人的滚动动画的首选。原创 2024-06-25 09:24:43 · 1032 阅读 · 0 评论 -
GSAP从入门到精通
本文GSAP所有的用法教程大致到这里就结束了,本文涉及到了一些动画方面的概念,有些不准确的地方欢迎指正。作者:傲娇的koala来源:优快云原文:https://blog.youkuaiyun.com/xgangzai/article/details/130120365版权声明:本文为作者原创文章,转载请附上博文链接!优快云,CNBLOG博客文章一键转载插件t=N7T8。原创 2024-06-25 09:14:58 · 4536 阅读 · 0 评论 -
主流跨端框架Taro、uni-app、WePY、mpvue、chameleon区别对比
那说了那么多,到底用哪个呢?如果不介意尝鲜和学习 DSL 的话,完全可以尝试 WePY 2.0 和 chameleon ,一个是酝酿了很久的 2.0 全新升级,一个有专门针对多端开发的多态协议。uni-app 和 Taro 相比起来就更像是「水桶型」框架,从工具、UI 库,开发体验、多端支持等各方面来看都没有明显的短板。而 mpvue 由于开发一度停滞,现在看来各个方面都不如在小程序端基于它的 uni-app。当然,Talk is cheap。原创 2024-06-13 08:28:05 · 1758 阅读 · 0 评论 -
主流多端开发框架全面对比
虽然前面笔者从不同的角度分析了各个框架的情况,比如上手,开发环境以及简单的性能对比,生态情况等。但是对于这些框架来说,其实还有很多研究的空间,这篇文章只是客观的记录了笔者对不同框架初次上手和调研情况的一个过程。所以难免有一些地方不够全面,但已基本反映出现状。从性能上看 AVM 的开发体验和编译速度,性能表现都非常好,虽然是国产的框架但是不比国外的要差,其次是 Flutter,RN,最后是 Ionic 和 NativeScript。原创 2024-06-13 08:22:21 · 1956 阅读 · 0 评论 -
桌面应用开发框架比较:Electron、Flutter、Tauri、React Native 与 Qt
背景:Electron 由 GitHub 开发,因其使用 HTML、CSS 和 JavaScript 等 Web 技术构建跨平台桌面应用程序的能力而广受欢迎。主要功能:Electron 通过其 Node.js 集成提供对本机 API 的轻松访问,使开发人员能够创建功能丰富的应用程序。它还支持用 C++ 编写的本机插件,尽管构建这些插件可能更复杂且容易出错。原创 2024-06-12 08:38:51 · 4315 阅读 · 1 评论 -
Next.js入门
如果你用过 React 或者想尝试 React,那么建议你使用 Next.js 来搭建 React 项目,本篇文章将带你详细了解 Next.JS 主要的一些功能,看它能给我们带来什么样的能力,然后再谈一下对 React 单页应用的看法。Next.js 已经很全面了,但还是有一些需要开发者自己去处理,比如请求方法(感觉后面有可能官方会提供统一方案)、redux、多语言等等,这些我之前写了一些相关的文章,感兴趣的可以去看看,没写的后面也会补上。原创 2024-06-02 10:44:26 · 418 阅读 · 0 评论 -
使用cross-env兼容windows和linux环境的nodejs变量
由于办公和家里的开发环境不同(windows和linux)在处理nodejs项目的时候,脚本设置变量的时候设置方式不同,使用cross-env可完美解决配置方式不同的窘境,nodejs使用获取对应端口号。原创 2024-06-02 10:40:45 · 578 阅读 · 0 评论 -
Electron 详解
在最近的学习中,我接触了Electron这个前端框架,尽管学习进程断断续续,但我仍想分享一下我对它的了解。本文将带着真正小白的视角,向大家介绍Electron是什么、它的应用场景、学习方法以及为我们带来的好处。我们来看官网如何介绍自己吧Electron 是一个使用 JavaScript、HTML 和 CSS 构建桌面应用程序的框架。嵌入Chromium。原创 2024-05-28 08:23:58 · 2204 阅读 · 0 评论 -
哪个跨平台框架才是最好的选择?React Native、Flutter 还是 Ionic
总结一下这篇文章,不得不提的是,我们的目的不是宣传跨平台应用开发框架哪个获胜。相反,本文简单的目的是帮助你理解这三个跨平台框架的优点和局限性,以便你能够为应用程序开发框架做出一个完美的选择。在评估了各种调查报告后和统计数据之后,本文对信息进行了分析,并对这三个框架中的巨头进行了详细的比较。优快云,CNBLOG博客文章一键转载插件。原创 2024-05-27 16:18:06 · 1198 阅读 · 0 评论 -
CSS 网页字体最佳实践
为了满足不同平台,以及 Emoji 更好的显示效果(不会被前面的系统字体或兜底字体覆盖),建议使用下面代码配置网页字体。转载 2024-05-20 10:09:10 · 173 阅读 · 0 评论 -
openlayers入门教程
平铺图层。对于提供预呈现、平铺的网格图像的层源,这些网格按特定分辨率的缩放级别组织。图像图层。服务器呈现的映像,可用于任意范围和分辨率。(3)ol.layer.Vector()很常用矢量图层。矢量平铺图层。图层用于客户端呈现矢量平铺数据。转载 2024-05-11 15:47:37 · 3174 阅读 · 0 评论 -
React-Native 消息推送
在这里我们可以选择大厂的推送,优先使用极光推送,下一篇将介绍如何使用阿里推送。转载 2024-04-28 08:57:42 · 54 阅读 · 0 评论 -
不会这 10 个 Web API,你还好意思说你是前端开发者?
以上Web API和它们的使用场景,这些API可以帮助我们更方便地实现Web应用的各种功能。当然,除了这些API之外,还有很多其他有用的API和工具,建议大家多多探索,以便更好地应对Web开发的各种挑战。转载 2024-04-27 08:40:50 · 26 阅读 · 0 评论 -
uniapp 常见问题(QA)
UniApp 是一个基于 Vue.js 的跨平台应用开发框架,可以使用 Vue.js 的开发语法编写一次代码,然后通过编译生成可以在多个平台(包括iOS、Android、H5 等)上运行的应用。UniApp 具有以下特点:跨平台:开发者可以使用相同的代码基底构建多个平台的应用,避免了针对不同平台的重复开发。高性能:UniApp 在运行时使用原生渲染技术,具有接近原生应用的性能表现。开放生态:UniApp 支持原生插件和原生能力的扩展,可以调用设备的硬件功能和第三方原生 SDK。转载 2024-04-24 11:16:31 · 149 阅读 · 0 评论 -
前端开发软件大比拼:Hbuilder、VSCode、Sublime和其他工具介绍
前端开发是指使用HTML、CSS、JavaScript等技术来创建网页或网站的过程。前端开发需要使用一些专业的软件来编写、调试和运行代码,这些软件被称为前端开发工具或编辑器。市面上有很多种前端开发工具,每一种都有自己的特点和优势,那么如何选择适合自己的前端开发工具呢?本文将对比几款比较流行的前端开发工具,包括Hbuilder、VSCode、Sublime和其他一些软件,分析它们的优缺点和使用情况,帮助你做出更好的选择。转载 2024-04-17 08:22:13 · 1826 阅读 · 2 评论 -
H5 和小程序的区别
从“微信之父” 张小龙的定义里,我们可以了解到,小程序其实就是内嵌在微信,不需要安装和卸载的一种新应用形态。它具备的两个强属性:提高效率,用完即走!因此小程序的设计以轻便、快捷为原则,鼓励用户“即用即走”!注意:除了微信小程序,还有百度小程序、微信小程序、支付宝小程序、抖音小程序,都是每个平台自己开发的,都是有针对性平台的应用程序。以为目前主流的就是微信小程序,所以下文中的小程序都默认指代“微信小程序”!小程序因为内嵌再微信里,所以它的运行只能依赖微信客户端,也就是说只能在微信里打开。什么是 H5?转载 2024-04-17 08:04:20 · 52 阅读 · 0 评论 -
什么是快应用?与原生APP相比优势在哪里
目前,头部互联网企业以及手机厂商两大阵营,正打得不可开交。腾讯、阿里、百度、等头部互联网企业,齐齐发力小程序,借助于开发者的力量,来强大自身的服务能力,提高超级平台的粘性,深挖存量用户的价值;华为、、vivo、小米等硬件企业,则是发力快应用,从手机底层系统层面开始“拦截”用户,让用户维持APP使用习惯。不管是小程序、还是快应用,都是为解决用户快速获取服务需求的一种突破,只不过是结合各家优势来做。如果说,小程序是微信搭建的快捷入口,那么快应用就是安卓系统内搭建的快速入口。转载 2024-04-17 07:43:30 · 726 阅读 · 0 评论 -
超详细讲解H5移动端适配
移动互联网发展至今,各种移动设备应运而生,但它们的物理分辨率可以说是五花八门,一般情况UI会为我们提供375尺寸的设计稿,所以为了让H5页面能够在这些不同的设备上尽量表现的一致,前端工程师就不得不对页面进行移动端适配了。目前来讲这三种方案是现在用的最多的方案,它们都有各自的优缺点。「rem方案」适配原理稍复杂需要使用 JS设计稿标注的 px 换算到 css 的 rem 计算简单方案灵活,既能实现整体缩放,又能实现局部不缩放「vw 方案」适配原理简单不需要 JS 即可适配。转载 2024-04-15 14:00:48 · 469 阅读 · 0 评论 -
[转]Taro教程
得益于与React保持一致API的特性,Nerv可以无缝兼容到React的相关生态,例如react-router,react-redux,以及使用React开发的组件,所以对于旧的React项目,可以无痛地将React替换成Nerv。可以看出小程序和 Web 端上组件标准与 API 标准有很大差异,这些差异仅仅通过代码编译手段是无法抹平的,例如不能直接在编译时将小程序的 <view /> 直接编译成 <div />,因为他们虽然看上去有些类似,但是他们的组件属性有很大不同。转载 2024-04-15 10:08:11 · 194 阅读 · 0 评论 -
40 个JS单行代码
当你需要获取某年某月的最后一天getLastDate(new Date('2023-03-04')) // Fri Mar 31 2023 00:00:00 GMT+0800 (中国标准时间)转载 2024-04-07 18:56:34 · 24 阅读 · 0 评论 -
[转]什么情形下应该使用BFF?带你了解BFF的优势,即服务于前端的后端
BFF是一种Web架构,全名为Backends For Frontends,即为服务于前端的后端。这个词来源于Sam。BFF一般指的是在前端与后端之间加增加一个中间层。为什么要在前端和后端之间增加一个BFF层呢?计算机科学中的所有问题都可以通过加一层来解决。因此,需要使用BFF的场景,肯定是普通的前后端开发模式遇到了部分问题。例如在Sam Newman的文章中就描述了BFF解决多个展示端的场景。转载 2024-04-05 16:46:35 · 70 阅读 · 0 评论 -
[转]localForage基本使用
1.localForage是一个JavaScript库,能够类似的存储。2.他是异步存储,可以优化你的web应用程序的离线体验,而且能存储多种类型的数据3.localForage有一个优雅的降级策略,如果浏览器不支持indexedDB或者WebSQL则使用localStorage4.支持es6的 Promises API,而且支持添加回调函数二. 安装使用//使用npm//使用bower//引入js页面,将路径引入//引入vue页面三.使用localFroage进行存储。转载 2023-10-08 11:58:50 · 493 阅读 · 0 评论 -
[转]CSS解读之box-sizing属性
图1-3是第二个div的实际计算大小,这里div的实际宽度为10+10*2+10*2=50px,这么一计算,我们就很明白了,原来在设置了box-sizing为border-box后,容器的高宽就是实际容器的高宽,而不是单纯指的是内容区的大小。图1-3是第二个div的实际计算大小,这里div的实际宽度为10+10*2+10*2=50px,这么一计算,我们就很明白了,原来在设置了box-sizing为border-box后,容器的高宽就是实际容器的高宽,而不是单纯指的是内容区的大小。转载 2023-06-09 17:44:49 · 502 阅读 · 0 评论 -
[转]vue3项目使用signalR(长链接/服务端推送到客户端)
不过笔者这里因为要在on方法中使用vuex(useStore),所以将useMessageHub的代码全部放在了首页(Home.vue),因为单独的js无法像组件一样使用useStore和useRouter,不知道有没有好的解决办法。业务层需要发送消息时,先根据业务逻辑找到HubState.Users中需要接受消息的客户端,然后再发送消息即可。我们在某个页面上调用一下start()方法,然后主动触发一下test接口,就可以打印服务端发送的消息了。项目,前端是vue3全家桶项目,前后端分离。转载 2023-05-21 09:21:46 · 1124 阅读 · 0 评论 -
5个实用的JavaScript原生API
window.getComputedStyle() 方法返回一个 CSSStyleDeclaration 对象,其类型与样式属性相同,其中包含元素的计算样式。要从剪贴板中读取文本,请调用 navigator.clipboard.readText() 并等待返回的 Promise 进行解析。以上就是我今天想与你分享的5个关于JavaScript原生的API的知识内容,希望这些内容对你有所帮助。() 方法返回一个 DOMRect 对象,该对象提供有关元素大小及其相对于视口的位置的信息。带来意想不到的便利。转载 2023-04-21 08:27:33 · 234 阅读 · 0 评论 -
Vue3+el-scrollbar 实现向上加载更多向下刷新数据
【代码】Vue3+el-scrollbar 实现向上加载更多向下刷新数据。原创 2023-02-19 08:30:47 · 2654 阅读 · 2 评论 -
document.execCommand()用法
第三个参数也是可选的,在可应用的情况下,使用它来将任何所需参数传递给该命令。其中:sCommand为指令参数(如下例中的”2D-Position”),交互方式参数如果是true的话将显示对话框,如果为false的话,则不显示对话框(下例中的”false”即表示不显示对话框),动态参数一般为一可用值或属性值(如下例中的”true”)。(根据在winxpsp2的ie6下测试,虽然可能仍然调用了一次网络存取的api,但是并没有发生实际的请求,症状就是鼠标有极短时间的抖动,但是图像 不会闪烁)。转载 2023-01-02 16:24:54 · 1795 阅读 · 0 评论 -
Vue 大量数据展示卡顿解决方案(长列表优化)
使用插件展示大量数据,是可以比较流畅的渲染 / 滚动的作者:雪急飞绪来源:优快云原文:https://blog.youkuaiyun.com/qq_38689395/article/details/116757771版权声明:本文为作者原创文章,转载请附上博文链接!优快云,CNBLOG博客文章一键转载插件。转载 2022-12-14 19:06:48 · 4476 阅读 · 0 评论 -
vite解决警告: You are running the esm-bundler build of vue-i18n. It is recomme
解决方法:在vite.config.js加入以下代码resolve: { alias: { 'vue-i18n': 'vue-i18n/dist/vue-i18n.---------------------作者:BY_BC来源:优快云原文:https://blog.youkuaiyun.com/BY_BC/article/details/125387921版权声明:本文为作者原创文章,转载请附上博文链接!内容解析By:优快云,CNBLOG博客文章一键转载插件转载 2022-12-08 08:39:22 · 2844 阅读 · 0 评论 -
QuillEditor 图片添加缩放功能
安装插件使用:添加 ` :modules="modules"` 效果:原创 2022-12-06 18:52:04 · 684 阅读 · 0 评论 -
vue 项目中 splice 删除的不是指定的位置 而是最后一个
问题就是v-for选择里面 删除数组指定元素 结果splice删除的永远都是最后一个原本以为很简单的删除 结果事与愿违 现实给你一个玩笑 他删除的不是你指定位置的 而是一直都是最后一个 ,这个是因为vue的机制原理造成的 因为在于key的绑定问题,我只是用下标来绑定每一个标签的key,而没有与数组中元素挂钩,因此当删除数组元素时,vue会采用一种叫做’就地复用‘的原则,将旁边的元素直接拿过来使用知道是KEY的原因就好办了,那就把KEY换成唯一的 可以是时间戳 也可以ID 保证唯一性就可以了转载 2022-12-05 18:07:48 · 1659 阅读 · 0 评论 -
[vite] Failed to load source map for */*.css|.js
打开提示的文件,删除 “sourceMappingURL”这一行即可。原创 2022-12-02 15:59:32 · 3478 阅读 · 0 评论 -
Vue实现pptx在线预览
原文:https://blog.youkuaiyun.com/qq_43075191/article/details/125640149。版权声明:本文为作者原创文章,转载请附上博文链接!转载 2022-12-01 19:31:28 · 4878 阅读 · 3 评论 -
js导出PPT -- pptxgen使用方法
slide.addImage([远程/本地]路径,x,y,宽,高) x,y,w,h 类型:string,number(‘n%’)原文:https://blog.youkuaiyun.com/weixin_42412237/article/details/114530819。视频支持 mpg, mov, mp4, m4v,等。版权声明:本文为作者原创文章,转载请附上博文链接!几乎200种类型可以添加到PPT中。音频支持 mp3, wav,等。允许添加音频,视频,在线视频。## 1. 文件引入。转载 2022-12-01 19:30:45 · 2143 阅读 · 0 评论 -
VUE3+pdfh5实现预览Pdf文件
【代码】VUE3+pdfh5实现预览Pdf文件。原创 2022-12-01 15:29:49 · 1858 阅读 · 0 评论 -
VUE3中实现word的预览功能
VUE3中实现word的预览功能原创 2022-11-30 10:26:20 · 5107 阅读 · 0 评论 -
Vue3 用Vuex.Store 保存token和用户信息
如果想持久保存,可以使用。原创 2022-11-27 11:08:51 · 4845 阅读 · 0 评论