草庐IT

纯前端

全部标签

前端开发框架React技术如何与小程序结合,进行页面构建

具体实现的简要介绍前端开发框架React可以通过小程序提供的开发工具和API进行结合。例如使用小程序提供的WebView组件来加载前端框架的页面。或者使用小程序提供的组件和API来实现前端框架的功能。同时,也可以通过小程序提供的云开发功能来实现前端框架与后端数据的交互。与微信小程序的实现可以通过使用小程序的开发框架,如微信小程序的开发框架,来与微信小程序结合。具体实现方式如下:首先,需要安装小程序开发工具和React的相关依赖。npminstall--savewechat-miniprogram下一步,在小程序开发工具中创建一个新的小程序项目,并在项目中创建一个React组件。import{C

使用vue实现导出Excel功能【纯前端】

项目场景:最近接手一个项目,其中一个需求是将查询出来table中的数据导出为Excel文件,并下载到本地。问题来了,这种东西,不是应该后端去实现更好一些吗?如果放在前端做,要拿到全部数据,然后把这些数据进行解析,再进行一系列的骚操作转化成Excel文件,假如数据量少还好,万一数据量庞大,给我整个几万条,那浏览器岂不是卡死??(当然这只是我这枚小菜鸟的个人见解,如果有路过的大神有好的建议或者经验,还请赐教一下~~)当我把这些风险反馈给sb经理时,人家以为我偷懒不想做,给出各种理由反驳我。。。行吧,你说做我就做!没办法,人在屋檐下,不得不低头嘛。--------------------------

【JS 】SharedWorker 优化前端轮询请求

1.背景目前公司系统首页存在一个定时的轮询请求/Admin/Dashboard/GetAppRelaseNotice,包含一些需要实时反映在前端的操作(如:页面版本,站内信,页面配置更新等)问题很明显,单个页面的情况下,每分钟会发送一次请求;但如果同时打开多个tab,每个tab每分钟都会发送一次请求2.思路针对这个情况,可以使用SharedWorker+BroadcastChannel来实现多个tab共用一个后台任务的情况,减少后端服务器压力的同时也可以提升部分前端的性能;SharedWorker:接口代表一种特定类型的worker,可以从几个浏览上下文中访问。BroadcastChannel

前端性能优化学习之请求和响应优化(HTTP 缓存[强缓存、协商缓存、缓存策略等]、CDN 缓存)

HTTP缓存在任何一个前端项目中,访问服务器获取数据都是很常见的事情,但是如果相同的数据被重复请求了不止一次,那么多余的请求次数必然会浪费网络带宽,以及延迟浏览器渲染所要处理的内容,从而影响用户的使用体验。如果用户使用的是按量计费的方式访问网络,那么多余的请求还会隐性地增加用户的网络流量资费。因此考虑使用缓存技术对已获取的资源进行重用,是一种提升网站性能与用户体验的有效策略。缓存的原理是在首次请求后保存一份请求资源的响应副本,当用户再次发起相同请求后,如果判断缓存命中则拦截请求,将之前存储的响应副本返回给用户,从而避免重新向服务器发起资源请求。缓存的技术种类有很多,比如代理缓存、浏览器缓存、网

Vite 4.0 发布,下一代的前端工具链

继在五个月前发布Vite3后,现在Vite4正式发布。如今npm每周的下载量从100万上升到250万,并继续保持增长。在今年的JamstackConf调查中,社区中的使用率从14%跃升至32%,同时保持了9.7分的高满意度。主要变化与Vite3相比,这个主要版本的更新幅度较小,主要目的是升级到Rollup3。我们已经与Vite生态中的各方合作,确保这个新的主要版本有一个平滑的升级路径。Rollup3Vite现在使用Rollup3,它让我们简化了Vite的内部资源处理,并有许多改进。点击这里查看Rollup3更新说明。框架插件脱离了Vitecoremonorepo@vitejs/plugin-v

前端测试指南:Vue3 测试工具介绍与使用

1.介绍1.1前端测试的重要性在现代前端开发中,测试已经成为了必不可少的一环。测试可以保证代码的质量、可维护性和可靠性,防止代码的潜在错误和漏洞。同时,测试可以让开发者更加自信地提交代码和合并代码,以及更快地解决问题。因此,测试已经成为了前端开发中不可或缺的一部分。1.2测试分类前端测试可以分为单元测试、集成测试和端到端测试等。其中,单元测试是最基本、最重要的测试类型,它可以针对代码的最小单元(函数、组件等)进行测试。集成测试则是测试多个组件之间的交互和协作,而端到端测试则是测试整个应用的功能和流程。1.3Vue3测试工具介绍Vue3是一种流行的前端框架,它提供了很多测试工具和库,帮助开发者测

前端常见需求整理 - 日期处理(包含moment、时间戳、日期对象)

格式介绍moment对象使用UI框架的时间相关组件时(如ant-design),默认的绑定值的格式往往为这种。/*控制台的打印效果*/Moment{...}Moment{_d:(...)_isAMomentObject:true_isUTC:(...)_isValid:(...)_locale:(...)_pf:(...)}字符串部分栗子对应YYYY-MM-DDHH:mm:ss2022-04-1220:30:00YYYY/MM/DDHH:mm:ss2022/04/1220:30:00YYYY/MM/DDhh:mm:ss2022/04/1208:30:00YYYY/M/DHH:mm:ss2022

从浏览器输入url到页面加载(六)前端必须了解的路由器和光纤小知识

前言上一章我们说到了数据包在网线中的故事,说到了双绞线,还说到了麻花。这一章继续沿着这条线路往下走,说一些和cdn以及路由器相关,运营商以及光纤相关的小知识,前端同学应该了解一下的 目录前言1. CDN和路由器有关系吗?2.你的电脑能直接上网吗?3. 运营商的井盖4.通信线路服务 5.小结1. CDN和路由器有关系吗?我们做前端开发经常会谈到cdn加速的话题,意思就是比如我们的网站部署在县里,村里的人访问网站,就要发送请求数据,输入url,然后请求从生产队出发,到达村里,村里在到乡里,乡里又到县里,最终找到那台服务器,访问网站内容,然后数据再从县里原路返回生产队,然后我们的手机上显示了响应的网

【区块链】走进web3的世界-对于前端来说,web2与web3的区别

web3离不开几个概念,智能合约、区块链、前端交互   1、智能合约可以直接与区块链中的区块进行交互;   2、前端通过web3.js/ethers.js等npm库可以和智能合约进行交互;说的直白点,web3与web2对于前端来说,只是对接的对象发生了变化,从后端API接口改为了智能合约。这就需要我们去了解智能合约Solidity。1、web3的一些基本概念ProviderProvider(提供者)是一个用于连接以太坊网络的抽象类,提供了只读形式来访问区块链网络和获取链上状态。SignerSigner(签名器)通常是以某种方式直接或间接访问私钥,可以签名消息和在已授权网络中管理你账户中的以太币

前端需要理解的HTML知识

 HTML(超文本标记语言,HyperText Markup Language)不是编程语言,而是定义了网页内容的含义和结构的标记语言。。“超文本”(hypertext)是指连接单个网站内或多个网站间的网页的链接。HTML使用“标记”(markup)来注明文本、图片和其他内容,以便于在Web浏览器中显示。HTML由一系列元素组成,标签用于创建元素,标签里的元素名不区分大小写,但推荐将标签名全部小写。不包含任何内容的元素称为空元素,空元素不能存在结束标签,比如。1Doctype声明即文档类型定义(DTD),告知浏览器采用的文档解析标准,分为严格模式(标准模式——W3C标准)和混杂模式(兼容模式—