- 综合排序
- 最热优先
- 最新优先
- 来自专栏音视频技术
高品质互动在线课堂：前端开发优化实践
本文是tutorabc前端负责人和君在LiveVideoStackCon 2017上的分享整理，主要介绍了在线授课系统Tutormeet+前端开发实践，包括技术选型、性能优化、持续交付实践以及APM系统 演讲 / 和君 整理 / LiveVideoStack 大家好，感谢LiveVideoStack提供分享的机会，今天的分享主题是《高品质的互动在线课堂与开发实践》，是基于我公司的一个授课平台产品展开介绍的 首先，自我介绍下，我有着十多年的前后端开发经验，最近几年的重点在前端架构和前端技术体系搭建等工作，曾在途牛等互联网公司工作，现任TutorABC前端负责人。 开发构建采用了Webpack3.0，Babel / PostCSS，所有的组建开发是基于React Storybook做的，单元测试使用的是Jasmine，以上就是整个TM+前端整体的架构。 二、优化 优化会分为三个大版块去讲： 构建时优化，即编译时优化 运行时优化， 用户体验优化 1）构建时优化： 代码分割 当代的Web前端工程肯定离不开构建， 5年前所有的Web页面上，可能写的Source
1.8K20发布于 2021-09-02 - 来自专栏大数据钻研
HTML5游戏前端开发【秘籍】
QQ空间Android版4.2和4.5上线的玩吧游戏“空间疯狂套牛”是一款使用HTML5开发出的手机游戏，虽然还有很多不足，但其中使用的一些技术与技巧还是很有必要为大家分享出来，方便大家用秘籍打通各种关卡创造出更多更好的 HTML5游戏。 所以移动位置也要缩放一半background-position: -388px 0 这里的难点在于图片的处理，以下是一些实例，供大家参考： 另外要注意绳子这里其实是有三个状态， 要分成三个CLASS来写，方便开发时切换不同的状态
2.3K70发布于 2018-04-18 - 来自专栏GitHub专栏
六个好用的前端开发在线工具
作者：LeanCloud 原作：[Mahdhi Rezvi] ，翻译自 New Frontend （缩进段落为译者附注） 来源：SegmentFault 社区 网上可以找到前端开发社区贡献的大量工具， EnjoyCSS 老实说，虽然我做过许多前端开发，但我并不擅长 CSS。当我陷入困境时，[EnjoyCSS] 是我的大救星。 开发简单页面时用起来比较方便，但不太适合复杂一点的前端项目（这类项目往往需要引入 CSS 框架）。 微软官方其实也提供了在线版本的 VSCode，可以在浏览器内使用 VSCode，并且支持开发 Node.js 项目（基于 Azure）。 不过 StackBlitz 更专注于优化前端开发体验，界面更加直观一点，也推出了 beta 版本的 Node.js 支持（基于 GCP，需要填表申请）。
1.2K10发布于 2020-06-18 - 来自专栏IT学习
小白如何区分HTML5开发和前端开发
由于移动互联网的快速发展，目前各类的互联网企业的前端开发都在向HTML5方向转型，所以企业急需HTML5开发人员，但是目前HTML5的市场情况整体上是供不应求的。 很多人不能分辨HTML5与前端。 自HTML5火热出炉，好像目前网上招聘的大部分前端开发一般是指html5开发，小白如何区分HTML5开发和前端开发呢 HTML5，超文本标记语言HTML新标准，主要用于前端开发及游戏制作。 虽然开发这类的应用其实是以JS为主，但因为HTML5这个概念很流行，所以微网站开发、小游戏开发、WebAPP或是公众号等应用，很多人都会说使用HTML5开发。 前端包含HTML5，HTML5其实只是前端开发中重要的一部分技术，是现在前端开发的标准组件，特别是在移动端的特效开发、游戏开发，以及APP的开发方向上非常流行。 如果把前端开发比作要建设的一座“大厦”，HTML5就相当于“钢筋水泥”。现在将前端技术叫HTML5。 欢迎大家在评论区评论留言，千锋哈尔滨小编会及时给大家解答疑惑的
1.4K20发布于 2019-11-19 - 来自专栏code秘密花园
推荐|六个好用的前端开发在线工具
网上可以找到前端开发社区贡献的大量工具，这篇文章列出了我最喜欢的一些工具，这些工具给我的工作带来了许多便利。 1. EnjoyCSS 老实说，虽然我做过许多前端开发，但我并不擅长 CSS。 开发简单页面时用起来比较方便，但不太适合复杂一点的前端项目（这类项目往往需要引入 CSS 框架）。 2. 微软官方其实也提供了在线版本的 VSCode，可以在浏览器内使用 VSCode，并且支持开发 Node.js 项目（基于 Azure）。 不过 StackBlitz 更专注于优化前端开发体验，界面更加直观一点，也推出了 beta 版本的 Node.js 支持（基于 GCP，需要填表申请）。 5. CanIUse CanIUse是非常好用的在线工具，可以方便地查看各大浏览器对某个特性的支持程度。 我过去经常碰到自己开发的应用的一些功能在其他浏览器下不支持的情况。
2.2K20发布于 2020-05-08 鸿蒙5开发宝藏案例分享---在线短视频流畅切换
鸿蒙官方早把‘性能优化外挂’塞你手里了，就藏在开发者联盟的【最佳实践】里！”** 兄弟们，最近在鸿蒙开发者联盟里扒文档时，**无意间挖到个宝藏分区——【最佳实践】**。好家伙！ *折叠屏专属** - 悬停模式：分栏布局自动切换（如Mate X3悬停看视频） - 跨设备流转：音乐App播放接力（手机切平板无感续播） > **挖宝路径**（开发者联盟内 → 甩【最佳实践】里的 **“丢帧分析工具链”** - 设计师丢来“折叠屏悬停交互”需求 → 复制 **【一多开发实例】分栏代码** - 用户吐槽“滑动视频像PPT” → 直接祭出今天这组 - 性能优化：冷启动/包体积/内存泄露 - 一多开发：16大行业场景适配 - 动效实战：一镜到底/组件拖拽/深色模式
31110编辑于 2025-06-27基于HTML5开发的Markdown在线编辑器
随着互联网的发展，越来越多的在线Markdown编辑器应运而生，为用户提供了更加便捷、高效的写作和编辑环境。本文将探讨基于HTML5开发的Markdown在线编辑器的设计原理、功能特点以及技术优势。 演示地址https://markdown-editor.org设计原理基于HTML5开发的Markdown在线编辑器采用前端技术实现编辑器界面和交互逻辑，后端服务器负责保存、分享和协作功能。 技术优势跨平台：基于HTML5的在线编辑器可以在不同操作系统和设备上运行，无需安装插件或软件。响应式设计：编辑器界面采用响应式布局设计，适配不同屏幕大小和分辨率，提供一致的用户体验。 基于HTML5开发的Markdown在线编辑器为用户提供了一种高效、便捷的写作和编辑环境，使用户可以专注于内容创作，提高工作效率。 随着在线编辑器技术的不断完善和创新，相信基于HTML5的Markdown编辑器将在未来更加广泛地应用于不同领域，为用户带来更优质的编辑体验和服务。
78110编辑于 2024-06-04- 来自专栏代码小技巧分享分析
HTML5前端开发真的会被取代吗？
于是很多人就慌了手脚 “手机APP可以直接生成网页，取代了前端工程师的一部分工作，随着APP的进一步开发使用，前端开发的行业空间将更加狭小，是不是就意味着，前端开发正面临着被淘汰的局面？” 真正的前端开发并不是傻瓜式的网页生成可以取代的，在这个前端开发快速发展的互联网时代，你还认为前端开发只是切网页的，那你就大错特错了。 1 2 3 4 5 6 2、行业内大批学艺不精者造成市场饱和假象 由于前端工程师的入门门槛较低，很多人认为HTML、CSS、JavaScript并不是很难掌握的语言，似乎只要花一点时间，无论是谁，都可以通过网上教程或者书本入门 前端开发技术日新月异，那么前端开发攻城狮的未来又在哪里呢？ Web）：需要大量的后台系统来做数据分析/机器学习 播放器/游戏：H5代替Flash，如Web Audio、Web Video、Canvas 容器/DSL/内核/小程序：支付宝/微信/钉钉容器，内核（也就是
1.2K20发布于 2021-09-19 - 来自专栏call_me_R
前端开发中 5 个很赞的资源
---- 原文链接 5 great resources for front-end development -- 作者 Rosie Wynne Web 开发社区非常庞大，要找到可靠且准确的资源让人觉得慌 来自 MDN Docs 的技术文档 MDN 文档是开发人员为开发者提供的信息蜂巢。从基础知识到最新的技巧和趋势，该网站提供适合初学者到经验丰富的开发人员的文档和工具。 作为一个前端开发人员，你必须确保你代码生成的用户界面在不同的浏览器中，表现得都符合预期。 5. Roadmap.sh 你刚开始学习 web 开发？Roadmap.sh 提供社区服务，其包含大量教育内容来指导你。 前端路线图以图形方式展示了 web 开发需要的技能、概念和技术，并附上可靠的资源。其中很多资源有订阅选项，但是我们建议你从免费版本开始，如果你觉得有用再投资。
34920编辑于 2023-04-22 - 来自专栏h5
h5即时聊天|在线聊天客服|h5在线咨询
鉴于之前有开发过h5仿微信聊天，最近又捣鼓了一个h5在线咨询项目，可实现顾客在线一对一聊天沟通，发送消息、表情(动图)，发送图片，推送商品链接。
6.8K100发布于 2018-07-27 - 来自专栏海仔技术驿站
前端成神之路-学成在线
学成在线页面制作 目标 理解 能够说写单页面我们基本的流程 能说出常见的css初始化语句 能说出我们CSS属性书写顺序 应用 能利用ps切图 能引入外部样式表 能把psd文件转换为html页面 学成在线的目的就是为了串联前面的所有知识 pink老师： 取义学有所成，为师之期望，君等成才者也，故曰学成网是也~~ 1.1 前期准备素材 学成在线PSD源文件 开发工具 = PS（切图） + sublime（代码） + chrome（测试） 版心盒子 里面包含 2号盒子 logo 版心盒子 里面包含 3号盒子 nav导航栏 版心盒子 里面包含 4号盒子 search搜索框 版心盒子 里面包含 5号盒子 user个人信息 注意，要求里面的 4 2.1 怎样打开Chrome的开发者工具？ 直接在页面上点击右键，然后选择 “检查” 快捷键 F12 或者 ctrl+shift+i ? 基本的结构布局是左边html 右边是 css ? 5）看看你有如下错误吗 ? ?
2K31发布于 2020-11-12 - 来自专栏前端达人
分享9个前端开发人员必备的在线工具手册
作为开发人员，我们可能会学习多门编程语言，不可能记住它们的所有方面。拥有 MDN 文档很有帮助，但查看每个小问题可能会很耗时。在这些情况下，“备忘查询手册”可以成为现实生活的救星。 2、HTML Cheat Sheet html-css-js.com，您是否需要一个包括编码示例，Web开发人员工具和标记代码生成器的资源？您会喜欢HTML清单。这张清单具有您需要的一切。 5、FLEX flexbox.malven.co，您可以使用弹性盒子flex布局构建响应式布局结构，而无需使用浮动或定位。这些简单的可视化示例将使您熟悉所有 flexbox 属性。
88920编辑于 2023-02-17 - 来自专栏高效插件
如何开发趣味H5小游戏《在线抓娃娃机》
作为一个H5游戏开发爱好者，最近写了一款非常有趣的小游戏，即《在线抓娃娃机》(在线体验)。在此总结分享一下开发经验，希望能够对大家有所启发。 图片游戏创意与设计《在线抓娃娃机》是一款受欢迎的街机游戏的在线版本，它将经典的抓娃娃机玩法带入了手机屏幕。玩家可以通过点击按钮控制抓手的移动和抓取动作，尝试抓取娃娃并将其成功送到出口。 开发过程开发《在线抓娃娃机》的过程中，主要采用了HTML5、CSS3和JavaScript等前端技术。页面布局与样式设计：首先设计了游戏的页面布局和样式，确保游戏界面美观、友好。 经验与教训在开发《在线抓娃娃机》的过程中，获得了一些宝贵的经验和教训：选择合适的技术：在开发过程中，选择合适的技术是非常重要的。 在开发过程中，要注重游戏的可玩性，例如，游戏的难度是否适中、游戏的回放价值是否高、游戏的奖励系统是否完善等。最后通过开发《在线抓娃娃机》，我深刻体会到了H5游戏开发的乐趣和挑战。
1K00编辑于 2023-08-20 - 来自专栏中后台可视化开发设计与实现
前端业务系统开发神器——定制化业务系统不过谈笑间，平平无奇在线开发纯前端业务系统设计
主要能力以可视化方式在线开发中后台类纯前端（react版）系统。 能够高效（高效高效高效）开发完整的前端业务（pc 中后台类）系统（包括页面创建设计、路由、接口调用、自定义组件...）以开发者视角方式生成代码，每一行都是有用并且可以读的懂的代码，react项目，几乎没有学习成本源码任意下载 ，没有条条框框束缚，随便拿捏 当然也可以滚动到下面的 在线开发 直接查看从 0 到 1 的开发视频来了解全貌简易介绍由服务器中预置基本脚手架（如：create-react-app 创建）。 、而上面的代码会实际下载到相关项目中，所以我们下载的项目都是可以读的懂的代码，几乎与开发者编写无异在线开发我们简短的视频实打实的来在线开发一个完整的系统，来感受一下效率以及是否适合你吧 ~！ light2f 中后台系统前端在线开发视频链接网站地址使用邮箱注册后即可以免费使用 & 下载，下载后更可以任意拿捏 点此传送入口，欢迎骚扰体验，大爷快来玩啊 >>>>>>>>>>>>>>>>>>>>>>
1.2K70编辑于 2022-12-13 - 来自专栏C/C++基础
web前端开发初学者十问集锦（5）
5.CSS z-index无效 我遇到的实际问题是一个div作为页面的header，里面包括logo（图片）和导航标题（文字），结果header中的logo图片被背景图片给覆盖了，而导航标题的文字没有被覆盖 W3CSchool规定JS的数据类型有： （1）数字（Number） （2）布尔（Boolean） （3）数组（Array） （4）字符串（String） （5）Null （6） 8.解决document.body is null的问题 在开发js中有用到document.body.appendChild的方法，提示”Uncaught TypeError: Cannot read JavaScript学习笔记(十四) 立即执行函数 [2]js事件处理函数中return的作用 [3]CSS z-index 属性 [4]JavaScript中函数参数的值传递和引用传递 [5]
1.3K20发布于 2018-08-03 - 来自专栏漫画前端
给2019前端开发的你5个进阶建议～
由于历史原因，开发框架同时基于 React 和 Angular，考虑到产品的复杂性、人员的短缺和技术背景各异，我们尝试了各种方法打磨工具体系来提升开发效率，以下是节选的5项主要方法。 前后端协作简图 除了上面讲的 iron-redux，我们还引入 Pont 实现前端取数，它可以自动把后端 API 映射到前端可调用的请求方法。 Pont 实现的效果有： 根据方法名自动匹配 url、method，并且对应到 prams、response 类型完美，并能自动提示 后端 API 接口变更后，前端相关联的请求会自动报错，再也不担心后端悄悄改接口前端不知晓 CR 并不只是为了找错，看到好的代码，不要吝啬你的赞美 本质是鼓励开发者间更多的沟通，互相学习，营造技术文化氛围 总结 以上5点当然不是我们技术的全部。 如果你也准备或正在开发复杂的前端应用，同时团队人员多样技术背景各异，可以参考以上5点，使用 Redux 实现规范清晰可预测的状态管理，深耕 TypeScript 来提升代码健壮性和可维护性，借助各种 Lint
1.6K10发布于 2020-12-16 - 来自专栏网页CAD
（H5前端CAD）在线CAD如何实现图形识别功能（真正国产CAD）
mxcad 为用户提供了图形识别功能和API，用户可根据自身需求对该功能进行拓展或二次开发，更多开发文档关注公众号：梦想云图网页CAD。图形识别步骤1. 打开mxcad在线示例demo。2. 在弹出的图形识别框内设置查找图形详情，设置图形名称可方便后续查找已识别图形；设置重新选择图形时，会覆盖当前选中图形；设置区域查找时，需要用户框选查找范围，若未框选范围则会默认为全图纸查找图形，如下图：5. 功能开发mxcad 图形识别功能中运用的核心思想是通过[McDbEntity]实体中每个实体的特征在图纸中进行查找，查找的实体中包括了[直线类]、[多段线类] 、[弧线类]、[圆类]，以及[块]。 下列为基于mxcad 封装的图形识别类 SearchSamePattern 用户可根据该类的使用方法利用 mxcad 进行二次开发，代码如下：import { DxfCode, McCmColor
1.2K10编辑于 2025-10-15 - 来自专栏Golang语言社区
【Go 语言社区】 H5 APP 前端开发专业的 HTML 5 Canvas
HTML5 的 canvas 元素使用 JavaScript 在网页上绘制图像。 画布是一个矩形区域，您可以控制其每一像素。 canvas 拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。 创建 Canvas 元素 向 HTML5 页面添加 canvas 元素。 document.getElementById("myCanvas"); 复制代码 然后，创建 context 对象： var cxt=c.getContext("2d"); 复制代码 getContext("2d") 对象是内建的 HTML5
1.5K60发布于 2018-03-19 - 来自专栏学习猿地
Web前端学习 第9章 教务管理系统开发5 前端代码讲解
token = localStorage.getItem("token"); 3 console.log(token) 4 if (token || to.path === "/") { 5 import axios from "axios" 2 3 const service = axios.create({ 4 baseURL: "http://127.0.0.1:7001/" 5 1 login() { 2 request({ 3 url:"/login", 4 method:'post', 5 data 1 <el-button type="danger" @click="quit">退出登录</el-button> 2 3 <script> 4 5 quit() { 6
63620发布于 2020-07-07 - 来自专栏编程微刊
八款前端开发人员更轻松的实用在线工具
写在前面：开发过程中，会遇到很多繁杂精细的麻烦问题，虽然知道要去按照步骤解决，但总归耗费大量的时间，那为什么不去寻求一个捷径，本文总结了一些在线工具，遇到问题，打开网页，想要的东西，分分钟就能解决，让开发变得高效 一：Atool在线工具： http://www.atool.org/ aTool,工具在线工具,由华中科技大学一位在校女研究生开发的在线工具集合网站,旨在做出最简单方便、最完整干净、最全面完整的工具网站 随便贴一张图 二：在线工具 http://tool.oschina.net/ 中国开源社区，ostools为开发设计人员提供在线工具,提供jsbin在线 CSS、JS 调试,在线 Java API文档, 迅雷下载链接转换,程序猿的在线工具，纯前端开发人员看过来，把工具箱打包带走。 五：脚本之家在线工具 http://tools.jb51.net/ 工具之家是脚本之家旗下网站,目的是为广大程序员、前端工程师、服务器管理员、网站站长等朋友提供在线工具,如代码格式化、代码混淆、代码加密
2.4K30发布于 2018-06-05
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号