• 关于

    界面元素可以做什么

    的搜索结果

回答

引用来自“李崇”的答案 分开两个类来处理。 Entity:和数据库中字段一一对应,比如你的员工和部门,是多对一关系, 所以员工类里面有一个deptId即可。如果是多对多关系那就建立一个中间表的类。 操作Entity中的字段就相当于操作数据库的字段。 VO:用来做显示,和界面上的元素一一对应。 UserVO{   privateintid;     privateStringdeptId;        privateStringdeptName; } 差不多是这样,传入到Dao层的是Entity,传出的是VO,通过关联查询的SQL语句为VO赋值,传递回界面。 你那种做法可能是用惯了hibernate的做法,不知道能不能理解。 明白了!嗯,这样扩展性大大提高了!多谢啊! 最好的设计--去掉pojo和DAO 现在可能无法理解 慢慢就理解了您的意思是不要考虑这些东西,直接考虑代码与数据库的关系是吗?拼接SQL,然后直接使用DBHelper执行?如果使用pojo与Dao,就要使用Hibernate是吗?最纯粹的才是最简便的,可惜我的场景就是这样的,头疼! 分开两个类来处理。 Entity:和数据库中字段一一对应,比如你的员工和部门,是多对一关系, 所以员工类里面有一个deptId即可。如果是多对多关系那就建立一个中间表的类。 操作Entity中的字段就相当于操作数据库的字段。 VO:用来做显示,和界面上的元素一一对应。 UserVO{   privateintid;     privateStringdeptId;        privateStringdeptName; } 差不多是这样,传入到Dao层的是Entity,传出的是VO,通过关联查询的SQL语句为VO赋值,传递回界面。 你那种做法可能是用惯了hibernate的做法,不知道能不能理解。 谢谢你耐心的回答,我明白你的意思了,一个对应数据库,一个对应需求,不过我有个疑问。如果针对UserVO的业务比较复杂,也就是外键跨表字段比较多,是不是要在UserVO里面定义很多跨表的属性,有没有基于对象设计思想的解决方案啊!这样是不是扩展性有所欠缺,VO与页面绑死了!不知我说的对否! 看了看楼主的设计,感觉挺合理的啊-。-有一个问题,不知楼主能否帮忙解答 为什么 executeUpdate(StringBuildersql,Object...params)没有传入Connection对象,而 executeQuery(Connectionconn,StringBuildersql,Object...params)传入了呢? 这样设计的道理是什么? 这个很简单,1对多在多的一方设置一个外键字段,为了实现实体查询方便、添加一个List临时字段,查询的时候多的可以查询放入该List即可同理其他1对1多对多也一样,hibernate也是这样思想的嗯,你说的思路我明白,如果这样做,就要自己写一个类似Hibernate的懒加载机制,不然会死循环的 引用来自“Timco”的答案 看了看楼主的设计,感觉挺合理的啊-。-有一个问题,不知楼主能否帮忙解答 为什么 executeUpdate(StringBuildersql,Object...params)没有传入Connection对象,而 executeQuery(Connectionconn,StringBuildersql,Object...params)传入了呢? 这样设计的道理是什么? 明白,我现在数据库的dao设计都是采用了楼主这样的设计。不过executeUpdate也传人了,因为这样可以在dao层同一connection进行事物控制,禁用autoCommit,等事物完成再提交。是啊,你说的很对,所以后续扩展了这个DBHelper类,重载了几个方法,也加入了执行事务的方法,执行存储过程的方法等等。

爱吃鱼的程序员 2020-06-22 14:20:35 0 浏览量 回答数 0

回答

我采用jquery一套作为UI,布局用jquery-ui-layout,表格使用jqgrid,tree用Ztree。 OA不是大型网站,不用考虑那么多。我觉得直接跳转新页面的做法最省事。维护也方便。如果个别页面加载比较慢的话,完全可以使用freemarker的生成静态html文件的功能就可以了。 ###### ajax接受格式化输出的数据(html代码)并在系统界面中显示。但这样ajax传输内容会增加。 传输内容会增加?好像很多人都是这么做的,你那个系统很庞大?访问量很巨大?对性能要求很苛刻吗?还是杞人忧天? 还有,这样做有点像ExtJS单页模式。这样做效率是高了,至少不用每个页面都加载CSS、JS,但是所有的内容都加载在同一个页面中,因此每个表单输入的name、id就很可能存在重名的现象…… ###### 一般其实直接用ajax去服务器请求数据,然后直接生成Dom节点,插入到HTML就行了。 如果数据较大的话,可以考虑加个loading图片之类的效果,对用户比较友好。 或者,第一次的时候去后台请求,之后就把数据缓存的客户端。也会增加用户体验度。 (这样做个人感觉比较灵活,而且数据是后台提供的,后期修改什么的对前端也有好处。前端只需展示数据,不用进行大量的过滤或者计算) ###### 我第一个网站就是这思路做的,所以感受深刻。 先说负面的。 会有比较高的维护成本和调试成本。 对一般网站而言,这样搞nav不适合seo。对协同系统,后台管理系统来说,这样开发又复杂,且本身这些系统对性能对传输量要求并不高。 这样实现绝对是对自己前端技术的一个锻炼。 参考前端模板,而且,jquery要用大量的bind把新载入的元素绑定事件。

kun坤 2020-06-06 16:19:44 0 浏览量 回答数 0

问题

全栈测试:平衡单元测试和端到端测试

技术小菜鸟 2019-12-01 21:30:35 3268 浏览量 回答数 1

阿里云试用中心,为您提供0门槛上云实践机会!

0元试用32+款产品,最高免费12个月!拨打95187-1,咨询专业上云建议!

回答

HTML5究竟是什么? (注:目前网上介绍HTML5的文章都是千篇一律,譬如某个时间段发布某个版本,这种对于初学者或者从实用性角度来看,没有太多甚至完全不具备学习价值,只能说了解到它的出现时间,但是具体作用是什么呢?基本都是没有详细阐述,不少读者看完估计还是一头雾水的,因此笔者会用更加通俗易懂的话语,让各位能够知道HTML5究竟是什么) 首先HTML是定义了网页的结构,那么HTML5则是其不断更新的一部分。它目前有两个版本, 第一个是万维网联盟的5.2推荐标准(w3c) ,是为网页内容开发者设计的;第二个是浏览器开发者的 HTML 生活标准(HTML Living Standard) ,由微软网页超文本技术工作小组公司(WHATWG)维护。 HTML5引入了一些新的元素和属性,同时也是一个 W3C推荐标准。Web 应用程序以这些 HTML 元素为基础运行,同时包含了 HTML4和 XHTML,但是向后兼容以前的版本。另外,它与 PHP 更加兼容,新的 api 包括拖放、网络消息和网络存储、协议处理程序注册、微数据、画布、文本轨道和定时媒体播放,还有一个标准化的服务器发送事件自动更新和更好的浏览器支持,这些新的 api 为网页设计者提供了更好的控制。对于生活标准版本,新的 API 还包括地理定位、web 音频(Javascript 音频应用程序)、web RTC 和 web 加密 API。 这些元素和属性反映了现代网站的典型用法,其中包括超文本标记语言和对文档对象模型(DOM)脚本的新兴趣。HTML5语法还允许在文档内部使用 MathML,而 indexeddb将存储扩展到本地存储之外。并且从 HTML 4.01中删除了一些不推荐的元素,包括像 font 和 center 这样的纯表示元素,这些元素的效果早已被更强大的层叠样式表所取代。此外,DOM 脚本在 Web 行为中的重要性也得到了重新强调。 HTML5知识点有哪些? 经过前面的一些讲解,相信各位对HTML5已经有初步的认识,那么接下来我们将会正式探讨下,究竟有哪些知识点需要我们学习掌握的呢?(注:由于HTML5涵盖知识点较多,且本文属于入门级别的知识指南,不适宜进行全面深入地讲解,因此笔者筛选出了必须掌握的知识点,希望能够让初学者迅速入门) 知识点一:HTML5主体结构 <!doctype> 声明必须位于 HTML5 文档中首行,声明此为HTML5文档 标签限定了文档的开始点和结束点,内部包含文档头部和主体 标签用于定义文档的头部,内部的元素可以引用脚本或者样式表、提供元信息等等,并且描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等,绝大多数文档头部包含的数据都不会真正作为内容显示给读者。 标签声明使用utf-8编码 标签定义文档标题 定义文档的主体,内部包含文档的所有内容,比如文本、超链接、图像、表格和列表等等,均可展示给用户浏览器显示出来(注释除外) 以上就是HTML5主体结构的讲解,可能有细心地读者就会发现,有的标签是一个的,有的又是两个对称的,那么这是何解呢? 这里就引入一个知识点,通常情况下绝大多数标签都是双标签,也就是需要写成格式,但是也有的单标签也称为自闭合标签是不需要结束符的,如 等,那么这些标签具体用法又是如何呢?下面我们将会进行常用标签的讲解! 知识点二:HTML5常用标签 众所周知,HTML5简单点说就是由一个个标签组成的文档,既然如此我们就需要学习,每一个标签究竟代表着什么含义如何使用呢?(因为标签实在太多,倘若全部阐释一遍,怕初学者们嫌弃篇幅太长感到枯燥,或者是知识点太多很难吸收掌握,因此笔者精选出一些较为常用的标签进行讲解,对于标签可能有多个属性可以选择,笔者同样会挑选出较为常用属性进行讲解) 注:以下标签,笔者没有截效果图,建议初学者自主尝试 注释标签:在我们日常编写代码时候,为了日后方便自己查看或者是别人查阅,我们通常会在某些地方写上注释标签,里面内容不会展示给浏览器用户看到 阿里云开发者社区 链接标签:超链接跳转,把需要跳转的网址写到标签的href里面,然后在开始标签和结束标签之间可以写内容展示出去,当用户点击内容将会发生跳转 换行标签:换行作用,有的小伙伴可能看到这里会说,为什么我写也是有效果的呢?这种写法不能说错误只能说是老版本的规范,按照HTML4.0规范都需要按照XHTML的写法,也就是对于单标签都是采用加斜杠的写法(下同) 按钮 按钮标签:按钮上需要展示什么文字,可在开始标签和结束标签之间写入,现阶段若写静态网站用得较少,后期学JS制作动态网站或者做交互时候比较常用 内容 块级标签:标签本身没有特殊含义,那么在其里面可以写文本内容,或者是加入其它标签均可,凡是加入其内部所有东西都会被其所包裹,形成一个独立的块级区域并且独自占用一行(css可格式化) 标题 标题标签:用于定义标题,从h1至h6均可根据自身需求选择 分隔符标签:起到装饰分隔作用,默认显示为一条黑色的水平线 图片标签:展示图片,src里面放置图片的链接,然后有时候可能出现各种原因导致图片未能加载,那么系统会自动展示alt里面的文字内容 输入框标签:默认是输入框,当然其有多个属性可以选择,然后较为常用的是type属性,该属性又有多个值可供选择,如: password 用户输入任何文本内容均会显示为小圆点 checkbox 选择框 Button按钮 列表 列表标签:通常用于展示一列数据,而且数据所采用的css样式均相同,譬如导航栏、当然还有 有序列表不过较为少用 段落 段落标签:写在内部的一段文字将会被定义为一个段落 脚本标签:现阶段不会用到,等学习到js需要用到,初学者可在标签内部写js代码,随着学习深入可以采用外部写好js文件后导入 文字 脚本标签:通常需要搭配css样式进行使用,对部分内容进行样式修改 样式标签:现阶段不会用到,等学习到css需要用到,样式需要写在标签内部 HTML5入门知识指南 经过前面的一系列学习,相信各位已经初步掌握HTML5的使用,能够制作一些简单的界面了,当然对于学习能力较强或者有一定基础的同学,可以自主深入学习HTML5深层次的知识点,当能够熟练敲出你想要的界面时候,那建议开始学习CSS让界面变得更加美丽,笔者下期将会给各位带来CSS入门知识指南,欢迎大家踊跃参与学习,当然如果有童鞋看完本文,对于某些知识点还是不太明白,或者是对下一期学习有什么建议,欢迎各位在下方评论区留言哦,如果觉得笔者文章写得不错,那么也可以分享给朋友一起学习,咱们下期再见啦!

剑曼红尘 2020-03-03 17:56:06 0 浏览量 回答数 0

回答

1. 原生 DOM 操作 VS 通过框架封装操作。 这是一个性能 vs. 可维护性的取舍。框架的意义在于为你掩盖底层的 DOM 操作,让你用更声明式的方式来描述你的目的,从而让你的代码更容易维护。没有任何框架可以比纯手动的优化 DOM 操作更快,因为框架的 DOM 操作层需要应对任何上层 API 可能产生的操作,它的实现必须是普适的。针对任何一个 benchmark,我都可以写出比任何框架更快的手动优化,但是那有什么意义呢?在构建一个实际应用的时候,你难道为每一个地方都去做手动优化吗?出于可维护性的考虑,这显然不可能。框架给你的保证是,你在不需要手动优化的情况下,我依然可以给你提供过得去的性能。 2. 对 React 的 Virtual DOM 的误解。 React 从来没有说过 “React 比原生操作 DOM 快”。React 的基本思维模式是每次有变动就整个重新渲染整个应用。如果没有 Virtual DOM,简单来想就是直接重置 innerHTML。很多人都没有意识到,在一个大型列表所有数据都变了的情况下,重置 innerHTML 其实是一个还算合理的操作... 真正的问题是在 “全部重新渲染” 的思维模式下,即使只有一行数据变了,它也需要重置整个 innerHTML,这时候显然就有大量的浪费。 我们可以比较一下 innerHTML vs. Virtual DOM 的重绘性能消耗: innerHTML: render html string O(template size) + 重新创建所有 DOM 元素 O(DOM size)Virtual DOM: render Virtual DOM + diff O(template size) + 必要的 DOM 更新 O(DOM change) Virtual DOM render + diff 显然比渲染 html 字符串要慢,但是!它依然是纯 js 层面的计算,比起后面的 DOM 操作来说,依然便宜了太多。可以看到,innerHTML 的总计算量不管是 js 计算还是 DOM 操作都是和整个界面的大小相关,但 Virtual DOM 的计算量里面,只有 js 计算和界面大小相关,DOM 操作是和数据的变动量相关的。前面说了,和 DOM 操作比起来,js 计算是极其便宜的。这才是为什么要有 Virtual DOM:它保证了 1)不管你的数据变化多少,每次重绘的性能都可以接受;2) 你依然可以用类似 innerHTML 的思路去写你的应用。 3. MVVM vs. Virtual DOM 相比起 React,其他 MVVM 系框架比如 Angular, Knockout 以及 Vue、Avalon 采用的都是数据绑定:通过 Directive/Binding 对象,观察数据变化并保留对实际 DOM 元素的引用,当有数据变化时进行对应的操作。MVVM 的变化检查是数据层面的,而 React 的检查是 DOM 结构层面的。MVVM 的性能也根据变动检测的实现原理有所不同:Angular 的脏检查使得任何变动都有固定的 O(watcher count) 的代价;Knockout/Vue/Avalon 都采用了依赖收集,在 js 和 DOM 层面都是 O(change): - 脏检查:scope digest O(watcher count) + 必要 DOM 更新 O(DOM change) - 依赖收集:重新收集依赖 O(data change) + 必要 DOM 更新 O(DOM change)可以看到,Angular 最不效率的地方在于任何小变动都有的和 watcher 数量相关的性能代价。但是!当所有数据都变了的时候,Angular 其实并不吃亏。依赖收集在初始化和数据变化的时候都需要重新收集依赖,这个代价在小量更新的时候几乎可以忽略,但在数据量庞大的时候也会产生一定的消耗。 MVVM 渲染列表的时候,由于每一行都有自己的数据作用域,所以通常都是每一行有一个对应的 ViewModel 实例,或者是一个稍微轻量一些的利用原型继承的 "scope" 对象,但也有一定的代价。所以,MVVM 列表渲染的初始化几乎一定比 React 慢,因为创建 ViewModel / scope 实例比起 Virtual DOM 来说要昂贵很多。这里所有 MVVM 实现的一个共同问题就是在列表渲染的数据源变动时,尤其是当数据是全新的对象时,如何有效地复用已经创建的 ViewModel 实例和 DOM 元素。假如没有任何复用方面的优化,由于数据是 “全新” 的,MVVM 实际上需要销毁之前的所有实例,重新创建所有实例,最后再进行一次渲染!这就是为什么题目里链接的 angular/knockout 实现都相对比较慢。相比之下,React 的变动检查由于是 DOM 结构层面的,即使是全新的数据,只要最后渲染结果没变,那么就不需要做无用功。 Angular 和 Vue 都提供了列表重绘的优化机制,也就是 “提示” 框架如何有效地复用实例和 DOM 元素。比如数据库里的同一个对象,在两次前端 API 调用里面会成为不同的对象,但是它们依然有一样的 uid。这时候你就可以提示 track by uid 来让 Angular 知道,这两个对象其实是同一份数据。那么原来这份数据对应的实例和 DOM 元素都可以复用,只需要更新变动了的部分。或者,你也可以直接 track by $index 来进行 “原地复用”:直接根据在数组里的位置进行复用。在题目给出的例子里,如果 angular 实现加上 track by $index 的话,后续重绘是不会比 React 慢多少的。甚至在 dbmonster 测试中,Angular 和 Vue 用了 track by $index 以后都比 React 快: dbmon (注意 Angular 默认版本无优化,优化过的在下面) 顺道说一句,React 渲染列表的时候也需要提供 key 这个特殊 prop,本质上和 track-by 是一回事。 4. 性能比较也要看场合 在比较性能的时候,要分清楚初始渲染、小量数据更新、大量数据更新这些不同的场合。Virtual DOM、脏检查 MVVM、数据收集 MVVM 在不同场合各有不同的表现和不同的优化需求。Virtual DOM 为了提升小量数据更新时的性能,也需要针对性的优化,比如 shouldComponentUpdate 或是 immutable data。 初始渲染:Virtual DOM > 脏检查 >= 依赖收集小量数据更新:依赖收集 >> Virtual DOM + 优化 > 脏检查(无法优化) > Virtual DOM 无优化大量数据更新:脏检查 + 优化 >= 依赖收集 + 优化 > Virtual DOM(无法/无需优化)>> MVVM 无优化 不要天真地以为 Virtual DOM 就是快,diff 不是免费的,batching 么 MVVM 也能做,而且最终 patch 的时候还不是要用原生 API。在我看来 Virtual DOM 真正的价值从来都不是性能,而是它 1) 为函数式的 UI 编程方式打开了大门;2) 可以渲染到 DOM 以外的 backend,比如 ReactNative。 总结 以上这些比较,更多的是对于框架开发研究者提供一些参考。主流的框架 + 合理的优化,足以应对绝大部分应用的性能需求。如果是对性能有极致需求的特殊情况,其实应该牺牲一些可维护性采取手动优化:比如 Atom 编辑器在文件渲染的实现上放弃了 React 而采用了自己实现的 tile-based rendering;又比如在移动端需要 DOM-pooling 的虚拟滚动,不需要考虑顺序变化,可以绕过框架的内置实现自己搞一个。

九旬 2020-05-24 11:46:45 0 浏览量 回答数 0

问题

如何应对不明需求做好测试

技术小菜鸟 2019-12-01 21:39:07 3352 浏览量 回答数 1

问题

Vue面试题汇总【精品问答】

问问小秘 2020-05-25 18:02:28 11132 浏览量 回答数 2

回答

原生XML扩展 我更喜欢使用其中一个原生XML扩展,因为它们与PHP捆绑在一起,通常比所有第三方库更快,并且在标记上给我所需的所有控制权。 DOM DOM扩展允许您使用PHP 5通过DOM API操作XML文档。它是W3C的文档对象模型核心级别3的实现,这是一个平台和语言中立的接口,允许程序和脚本动态访问和更新文件的内容,结构和风格。 DOM能够解析和修改现实世界(破碎)的HTML,并且可以执行XPath查询。它基于libxml。 使用DOM需要一些时间才能提高效率,但这个时间非常值得IMO。由于DOM是一个与语言无关的接口,因此您可以找到多种语言的实现,因此如果您需要更改编程语言,那么您很可能已经知道如何使用该语言的DOM API。 一个基本的用法示例可以在抓取A元素的href属性中找到,一般的概念概述可以在php的DOMDocument中找到 StackOverflow上已经广泛介绍了如何使用DOM扩展,因此如果您选择使用它,您可以确定您遇到的大多数问题都可以通过搜索/浏览Stack Overflow来解决。 XMLReader的 XMLReader扩展是一个XML pull解析器。读取器在文档流上作为光标前进,并在途中停在每个节点上。 与DOM一样,XMLReader基于libxml。我不知道如何触发HTML解析器模块,因此使用XMLReader解析损坏的HTML的可能性可能不如使用DOM,因为您可以明确告诉它使用libxml的HTML解析器模块。 使用php从h1标签获取所有值时,可以找到一个基本用法示例 XML解析器 此扩展允许您创建XML解析器,然后为不同的XML事件定义处理程序。每个XML解析器还有一些您可以调整的参数。 XML Parser库也基于libxml,并实现了SAX样式的XML推送解析器。它可能是比DOM或SimpleXML更好的内存管理选择,但是比XMLReader实现的pull解析器更难以使用。 SimpleXML的 SimpleXML扩展提供了一个非常简单且易于使用的工具集,用于将XML转换为可以使用普通属性选择器和数组迭代器处理的对象。 当您知道HTML是有效的XHTML时,SimpleXML是一个选项。如果你需要解析破碎的HTML,甚至不要考虑SimpleXml,因为它会窒息。 一个基本的用法示例可以在一个简单的CRUD节点程序和xml文件的节点值中找到,PHP手册中还有很多其他的例子。 第三方库(基于libxml) 如果您更喜欢使用第三方库,我建议使用实际上使用DOM / libxml而不是字符串解析的库。 FluentDom - 回购 FluentDOM为PHP中的DOMDocument提供了类似jQuery的流畅XML接口。选择器是用XPath或CSS编写的(使用CSS到XPath转换器)。当前版本扩展了DOM实现标准接口并添加了DOM Living Standard的功能。FluentDOM可以加载JSON,CSV,JsonML,RabbitFish等格式。可以通过Composer安装。 HtmlPageDom Wa72 \ HtmlPageDom`是一个用于轻松操作HTML文档的PHP库。它需要来自Symfony2组件的DomCrawler来遍历DOM树,并通过添加操作HTML文档的DOM树的方法来扩展它。 phpQuery(多年未更新) phpQuery是一个服务器端,可链接,CSS3选择器驱动的文档对象模型(DOM)API,基于用PHP5编写的jQuery JavaScript库,并提供额外的命令行界面(CLI)。 另见:https://github.com/electrolinux/phpquery Zend_Dom Zend_Dom提供了处理DOM文档和结构的工具。目前,我们提供Zend_Dom_Query,它提供了一个统一的界面,可以使用XPath和CSS选择器查询DOM文档。 的QueryPath QueryPath是一个用于操作XML和HTML的PHP​​库。它不仅适用于本地文件,还适用于Web服务和数据库资源。它实现了许多jQuery接口(包括CSS样式的选择器),但它在服务器端使用时经过了大量调整。可以通过Composer安装。 fDOMDocument fDOMDocument扩展了标准DOM,以便在所有错误情况下使用异常,而不是PHP警告或通知。为方便起见,他们还添加了各种自定义方法和快捷方式,并简化了DOM的使用。 军刀/ XML saber / xml是一个包装和扩展XMLReader和XMLWriter类的库,用于创建一个简单的“xml到对象/数组”映射系统和设计模式。编写和读取XML是单遍的,因此可以快速并且需要大型xml文件的低内存。 FluidXML FluidXML是一个用于使用简洁流畅的API来操作XML的PHP​​库。它利用XPath和流畅的编程模式,既有趣又有效。 第三方(不是基于libxml的) 构建DOM / libxml的好处是,您可以获得良好的开箱即用性能,因为您基于本机扩展。但是,并非所有第三方库都沿着这条路线行进。其中一些列在下面 PHP简单的HTML DOM解析器 用PHP5 +编写的HTML DOM解析器允许您以非常简单的方式操作HTML! 需要PHP 5+。 支持无效的HTML。 使用选择器在HTML页面上查找标签,就像jQuery一样。 从一行中提取HTML中的内容。 我一般不推荐这个解析器。代码库很糟糕,解析器本身很慢而且内存很耗。并非所有jQuery选择器(例如子选择器)都是可能的。任何基于libxml的库都应该比这更容易。 PHP Html解析器 PHPHtmlParser是一个简单,灵活的html解析器,允许您使用任何css选择器(如jQuery)选择标签。目标是帮助开发需要快速,简单的方法来废弃html的工具,无论它是否有效!这个项目最初是由sunra / php-simple-html-dom-parser支持的,但支持似乎已经停止,所以这个项目是我对他以前工作的改编。 同样,我不推荐这个解析器。CPU使用率很高,速度相当慢。还没有清除已创建DOM对象的内存的功能。这些问题尤其适用于嵌套循环。文档本身不准确且拼写错误,自4月14日以来没有回复修复。 加农 通用标记器和HTML / XML / RSS DOM解析器 能够操纵元素及其属性 支持无效的HTML和UTF8 可以对元素执行类似CSS3的高级查询(比如jQuery - 支持的命名空间) HTML美化器(如HTML Tidy) 缩小CSS和Javascript 排序属性,更改字符大小写,更正缩进等。 扩展 使用基于当前字符/标记的回调解析文档 操作以较小的功能分隔,以便轻松覆盖 快速而简单 从未使用过它。不知道它是否有用。 HTML 5 您可以使用上面的方法来解析HTML5,但由于HTML5允许的标记,可能会有怪癖。因此,对于HTML5,您要考虑使用专用解析器,例如 html5lib 基于WHATWG HTML5规范的HTML解析器的Python和PHP实现,可与主要桌面Web浏览器实现最大兼容性。 HTML5最终确定后,我们可能会看到更多专用解析器。还有一个W3的博客文章,名为How-To for html 5 parsing,值得一试。 网页服务 如果您不想编写PHP,您也可以使用Web服务。一般来说,我发现这些实用程序很少,但那只是我和我的用例。 ScraperWiki。 ScraperWiki的外部界面允许您以您希望在Web或您自己的应用程序中使用的形式提取数据。您还可以提取有关任何刮刀状态的信息。 常用表达 最后也是最不推荐的,您可以使用正则表达式从HTML中提取数据。通常,不鼓励在HTML上使用正则表达式。 您可以在网上找到与标记相匹配的大多数片段都很脆弱。在大多数情况下,它们只适用于非常特殊的HTML。微小的标记更改,例如在某处添加空格,或添加或更改标记中的属性,可以使RegEx在未正确编写时失败。在HTML上使用RegEx之前,您应该知道自己在做什么。 HTML解析器已经知道HTML的语法规则。必须为您编写的每个新RegEx讲授正则表达式。RegEx在某些情况下很好,但它实际上取决于您的用例。 您可以编写更可靠的解析器,但是使用正则表达式编写完整可靠的自定义解析器是浪费时间,因为上述库已经存在并且在此方面做得更好。

游客gsy3rkgcdl27k 2019-12-02 02:09:37 0 浏览量 回答数 0

问题

【分享】WeX5的正确打开方式(3)——绑定机制

小太阳1号 2019-12-01 21:23:54 5393 浏览量 回答数 3

问题

网页设计离用户的距离,只差一个好的体验

网匠精神 2019-12-01 21:33:58 1471 浏览量 回答数 0

问题

Android API兼容性指南

mqc 2019-12-01 21:00:01 2106 浏览量 回答数 0

回答

服务器和操作系统 1、主板的两个芯片分别是什么芯片,具备什么作用? 北桥:离CPU近,负责CPU、内存、显卡之间的通信。 南桥:离CPU远,负责I/O总线之间的通信。 2、什么是域和域控制器? 将网络中的计算机逻辑上组织到一起,进行集中管理,这种集中管理的环境称为域。 在域中,至少有一台域控制器,域控制器中保存着整个域的用户账号和安全数据,安装了活动目录的一台计算机为域控制器,域管理员可以控制每个域用户的行为。 3、现在有300台虚拟机在云上,你如何进行管理? 1)设定堡垒机,使用统一账号登录,便于安全与登录的考量。 2)使用ansiable、puppet进行系统的统一调度与配置的统一管理。 3)建立简单的服务器的系统、配置、应用的cmdb信息管理。便于查阅每台服务器上的各种信息记录。 4、简述raid0 raid1 raid5 三种工作模式的工作原理及特点 磁盘冗余阵列(Redundant Arrays of Independent Disks,RAID),把硬盘整合成一个大磁盘,在大磁盘上再分区,存放数据、多块盘放在一起可以有冗余(备份)。 RAID整合方式有很多,常用的:0 1 5 10 RAID 0:可以是一块盘和N个盘组合 优点:读写快,是RAID中最好的 缺点:没有冗余,一块坏了数据就全没有了 RAID 1:只能2块盘,盘的大小可以不一样,以小的为准 10G+10G只有10G,另一个做备份。它有100%的冗余,缺点:浪费资源,成本高 RAID 5 :3块盘,容量计算10*(n-1),损失一块盘 特点:读写性能一般,读还好一点,写不好 总结: 冗余从好到坏:RAID1 RAID10 RAID 5 RAID0 性能从好到坏:RAID0 RAID10 RAID5 RAID1 成本从低到高:RAID0 RAID5 RAID1 RAID10 5、linux系统里,buffer和cache如何区分? buffer和cache都是内存中的一块区域,当CPU需要写数据到磁盘时,由于磁盘速度比较慢,所以CPU先把数据存进buffer,然后CPU去执行其他任务,buffer中的数据会定期写入磁盘;当CPU需要从磁盘读入数据时,由于磁盘速度比较慢,可以把即将用到的数据提前存入cache,CPU直接从Cache中拿数据要快的多。 6、主机监控如何实现? 数据中心可以用zabbix(也可以是nagios或其他)监控方案,zabbix图形界面丰富,也自带很多监控模板,特别是多个分区、多个网卡等自动发现并进行监控做得非常不错,不过需要在每台客户机(被监控端)安装zabbix agent。 如果在公有云上,可以使用云监控来监控主机的运行。 网络 7、主机与主机之间通讯的三要素有什么? IP地址、子网掩码、IP路由 8、TCP和UDP都可以实现客户端/服务端通信,这两个协议有何区别? TCP协议面向连接、可靠性高、适合传输大量数据;但是需要三次握手、数据补发等过程,耗时长、通信延迟大。 UDP协议面向非连接、可靠性低、适合传输少量数据;但是连接速度快、耗时短、延迟小。 9、简述TCP协议三次握手和四次分手以及数据传输过程 三次握手: (1)当主机A想同主机B建立连接,主机A会发送SYN给主机B,初始化序列号seq=x。主机A通过向主机B发送SYS报文段,实现从主机A到主机B的序列号同步,即确定seq中的x。 (2)主机B接收到报文后,同意与A建立连接,会发送SYN、ACK给主机A。初始化序列号seq=y,确认序号ack=x+1。主机B向主机A发送SYN报文的目的是实现从主机B到主机A的序列号同步,即确定seq中的y。 (3)主机A接收到主机B发送过来的报文后,会发送ACK给主机B,确认序号ack=y+1,建立连接完成,传输数据。 四次分手: (1)当主机A的应用程序通知TCP数据已经发送完毕时,TCP向主机B发送一个带有FIN附加标记的报文段,初始化序号seq=x。 (2)主机B收到这个FIN报文段,并不立即用FIN报文段回复主机A,而是想主机A发送一个确认序号ack=x+1,同时通知自己的应用程序,对方要求关闭连接(先发ack是防止主机A重复发送FIN报文)。 (3)主机B发送完ack确认报文后,主机B 的应用程序通知TCP我要关闭连接,TCP接到通知后会向主机A发送一个带有FIN附加标记的报文段,初始化序号seq=x,ack=x+1。 (4)主机A收到这个FIN报文段,向主机B发送一个ack确认报文,ack=y+1,表示连接彻底释放。 10、SNAT和DNAT的区别 SNAT:内部地址要访问公网上的服务时(如web访问),内部地址会主动发起连接,由路由器或者防火墙上的网关对内部地址做个地址转换,将内部地址的私有IP转换为公网的公有IP,网关的这个地址转换称为SNAT,主要用于内部共享IP访问外部。 DNAT:当内部需要提供对外服务时(如对外发布web网站),外部地址发起主动连接,由路由器或者防火墙上的网关接收这个连接,然后将连接转换到内部,此过程是由带有公网IP的网关替代内部服务来接收外部的连接,然后在内部做地址转换,此转换称为DNAT,主要用于内部服务对外发布。 数据库 11、叙述数据的强一致性和最终一致性 强一致性:在任何时刻所有的用户或者进程查询到的都是最近一次成功更新的数据。强一致性是程度最高一致性要求,也是最难实现的。关系型数据库更新操作就是这个案例。 最终一致性:和强一致性相对,在某一时刻用户或者进程查询到的数据可能都不同,但是最终成功更新的数据都会被所有用户或者进程查询到。当前主流的nosql数据库都是采用这种一致性策略。 12、MySQL的主从复制过程是同步的还是异步的? 主从复制的过程是异步的复制过程,主库完成写操作并计入binlog日志中,从库再通过请求主库的binlog日志写入relay中继日志中,最后再执行中继日志的sql语句。 **13、MySQL主从复制的优点 ** 如果主服务器出现问题,可以快速切换到从服务器提供的服务; 可以在从服务器上执行查询操作,降低主服务器的访问压力; 可以在从服务器上执行备份,以避免备份期间影响主服务器的服务。 14、redis有哪些数据类型? (一)String 最常规的set/get操作,value可以是String也可以是数字。一般做一些复杂的计数功能的缓存。 (二)hash 这里value存放的是结构化的对象,比较方便的就是操作其中的某个字段。做单点登录的时候,就是用这种数据结构存储用户信息,以cookieId作为key,设置30分钟为缓存过期时间,能很好的模拟出类似session的效果。 (三)list 使用List的数据结构,可以做简单的消息队列的功能。另外还有一个就是,可以利用lrange命令,做基于redis的分页功能,性能极佳,用户体验好。 (四)set 因为set堆放的是一堆不重复值的集合。所以可以做全局去重的功能。为什么不用JVM自带的Set进行去重?因为我们的系统一般都是集群部署,使用JVM自带的Set,比较麻烦,难道为了一个做一个全局去重,再起一个公共服务,太麻烦了。 另外,就是利用交集、并集、差集等操作,可以计算共同喜好,全部的喜好,自己独有的喜好等功能。 (五)Zset Zset多了一个权重参数score,集合中的元素能够按score进行排列。可以做排行榜应用,取TOP N操作。另外,sorted set可以用来做延时任务。最后一个应用就是可以做范围查找。 15、叙述分布式数据库及其使用场景? 分布式数据库应该是数据访问对应用透明,每个分片默认采用主备架构,提供灾备、恢复、监控、不停机扩容等整套解决方案,适用于TB或PB级的海量数据场景。 应用 16、Apache、Nginx、Lighttpd都有哪些特点? Apache特点:1)几乎可以运行在所有的计算机平台上;2)支持最新的http/1.1协议;3)简单而且强有力的基于文件的配置(httpd.conf);4)支持通用网关接口(cgi);5)支持虚拟主机;6)支持http认证,7)集成perl;8)集成的代理服务器;9)可以通过web浏览器监视服务器的状态,可以自定义日志;10)支持服务器端包含命令(ssi);11)支持安全socket层(ssl);12)具有用户绘画过程的跟踪能力;13)支持fastcgi;14)支持java servlets Nginx特点:nginx是一个高性能的HTTP和反向代理服务器,同时也是一个IMAP/POP3/SMTP代理服务器,处理静态文件,索引文件以及自动索引,无缓存的反向代理加速,简单的负载均衡和容错,具有很高的稳定性,支持热部署。 Lighttpd特点:是一个具有非常低的内存开销,CPU占用率低,效能好,以及丰富的模块,Lighttpd是众多opensource轻量级的webserver中较为优秀的一个,支持fastcgi,cgi,auth,输出压缩,url重写,alias等重要功能。 17、LVS、NGINX、HAPROXY的优缺点? LVS优点:具有很好的可伸缩性、可靠性、可管理性。抗负载能力强、对内存和CPU资源消耗比较低。工作在四层上,仅作分发,所以它几乎可以对所有的应用做负载均衡,且没有流量的产生,不会受到大流量的影响。 LVS缺点:软件不支持正则表达式处理,不能做动静分离,如果web应用比较庞大,LVS/DR+KEEPALIVED实施和管理比较复杂。相对而言,nginx和haproxy就简单得多。 nginx优点:工作在七层之上,可以针对http应用做一些分流的策略。比如针对域名、目录结构。它的正则规则比haproxy更为强大和灵活。对网络稳定性依赖非常小。理论上能PING就能进行负载均衡。配置和测试简单,可以承担高负载压力且稳定。nginx可以通过端口检测到服务器内部的故障。比如根据服务器处理网页返回的状态码、超时等。并且可以将返回错误的请求重新发送给另一个节点,同时nginx不仅仅是负载均衡器/反向代理软件。同时也是功能强大的web服务器,可以作为中层反向代理、静态网页和图片服务器使用。 nginx缺点:不支持URL检测,仅支持HTTP和EMAIL,对session的保持,cookie的引导能力相对欠缺。 Haproxy优点:支持虚拟主机、session的保持、cookie的引导;同时支持通过获取指定的url来检测后端服务器的状态。支持TCP协议的负载均衡;单纯从效率上讲比nginx更出色,且负载策略非常多。 aproxy缺点:扩展性能差;添加新功能很费劲,对不断扩展的新业务很难对付。 18、什么是中间件?什么是jdk? 中间件介绍: 中间件是一种独立的系统软件或服务程序,分布式应用软件借助这种软件在不同的技术之间共享资源 中间件位于客户机/ 服务器的操作系统之上,管理计算机资源和网络通讯 是连接两个独立应用程序或独立系统的软件。相连接的系统,即使它们具有不同的接口 但通过中间件相互之间仍能交换信息。执行中间件的一个关键途径是信息传递 通过中间件,应用程序可以工作于多平台或OS环境。 jdk:jdk是Java的开发工具包 它是一种用于构建在 Java 平台上发布的应用程序、applet 和组件的开发环境 19、日志收集、日志检索、日志展示的常用工具有哪些? ELK或EFK。 Logstash:数据收集处理引擎。支持动态的从各种数据源搜集数据,并对数据进行过滤、分析、丰富、统一格式等操作,然后存储以供后续使用。 Kibana:可视化化平台。它能够搜索、展示存储在 Elasticsearch 中索引数据。使用它可以很方便的用图表、表格、地图展示和分析数据。 Elasticsearch:分布式搜索引擎。具有高可伸缩、高可靠、易管理等特点。可以用于全文检索、结构化检索和分析,并能将这三者结合起来。Elasticsearch 基于 Lucene 开发,现在使用最广的开源搜索引擎之一,Wikipedia 、StackOverflow、Github 等都基于它来构建自己的搜索引擎。 Filebeat:轻量级数据收集引擎。基于原先 Logstash-fowarder 的源码改造出来。换句话说:Filebeat就是新版的 Logstash-fowarder,逐渐取代其位置。 20、什么是蓝绿发布和灰度发布? 蓝绿:旧版本-新版本 灰度:新旧版本各占一定比例,比例可自定义 两种发布都通过devops流水线实现

剑曼红尘 2020-03-23 15:51:44 0 浏览量 回答数 0

问题

H5技术百问——不懂H5你就OUT啦

yq传送门 2019-12-01 20:27:41 44227 浏览量 回答数 46

问题

【Java学习全家桶】1460道Java热门问题,阿里百位技术专家答疑解惑

管理贝贝 2019-12-01 20:07:15 27612 浏览量 回答数 19

问题

【python学习全家桶】263道python热门问题,阿里百位技术专家答疑解惑

管理贝贝 2019-12-01 20:07:21 7217 浏览量 回答数 2

回答

虽然跨平台的移动APP开发有利有弊。但从业务初创的角度来看,优点应该是大于缺点的。而且,随着对跨平台移动应用需求的不断增长,现在可用的工具和框架数量也已经很可观了。 但选择过多会令人头疼,这就是为什么我们只关注最突出的跨平台移动开发框架的原因:React Native, Flutter, NativeScript, 和Xamarin。 为了让你更深入地了解是什么使这些工具成为2020年软件开发的可选选项,我们将根据以下标准对它们进行打分:社区支持、基于的编程语言、代码可重用性、性能、界面以及使用它们构建的重要应用程序。 React Native Reaction Native是Facebook于2015年发布的开源、跨平台的应用开发框架。作为2013年举办的一场内部黑客马拉松的产物,它已经成为最受欢迎的原生App开发替代方案之一,拥有2043名GitHub贡献者,获得了超过82900 GitHub标星。不断增长的社区认知度使得找到一支可靠且经验丰富的开发团队来承接你的项目变得相对容易。 Learn Once and Write Anywhere 基于React.JS,React Native利用JavaScript(根据2019年Stack Overflow的调查,JavaScript成为了最受欢迎的编程语言),为Android和iOS用户提供真正原生的应用外观和体验。另外,使该框架脱颖而出的是,如果你需要,React Native允许你使用Java、Objective-C或SWIFT编写部分原生模块来顺利处理复杂的操作,如视频播放或图像编辑。 虽然这些组件不能在不同的平台之间共享,并且需要开发人员做更多的工作,但多达90%的React Native代码是可以重用的。很好地表明该框架的座右铭不是“Write Once, Use Anywhere”,而是“learn once, write anywhere”。 就GUI而言,React Native可以提供接近原生的用户体验,这要归功于它使用了Android和iOS的本地控制器。它还使用带有UI元素的ReactJS库,这有助于加快UI设计过程。在开发移动应用程序时,使此框架值得考虑的另一个原因是,它可用在不丢失应用程序状态的情况下对UI进行更改。 另一个使React Native成为2020年跨平台移动开发框架的首选之一,是因为持续的更新,例如近期的版本 0.60 和 0.61 : 多项辅助功能改进。 更清晰、更人性化的开始屏幕。 快速刷新,融合了实时和热重新加载,从而显著加快了开发进程。 如上的Release Note只是React Native适应不断变化的需求其中一个很小的样本。 2020年值得考虑的第二个框架是Flutter。它在Google I/O 2017上宣布,并于2018年发布,对于跨平台的世界来说,它现在仍然是一个“新人”。但尽管如此,它已经获得了超过80500 GitHub星标和绝大多数工程师将其称为2019年Stack Overflow调查中最受欢迎的三个框架之一,Flutter无疑是一股不可忽视的力量。 Dart是如何使Flutter变得独一无二的 Flutter 背后的编程语言是 Dart,谷歌称之为"客户端优化",适合在任何平台上"快速构建应用程序"。它于 2011 年推出,是一种响应式面向对象的语言,被开发者认为相对容易学习,其中原因有二:第一,语法上它借鉴了C/C++ 和 Java; 第二,在官方网站上,您可以找到内容广泛且相当简单的文档。值得一提的是,Dart 附带了大量Flutter 兼容软件包的软件包,允许您使应用程序更加复杂。 lutter的一个主要优势是,它的性能比本文提到的任何其他跨平台移动开发框架都要好。这归功于Dart的编译器和Flutter拥有自己的一套小部件。结果是它能更快、更直接地与平台直接通信,而不需要JavaScript桥(例如,Reaction Native就是这种情况)。说到小部件:通过Flutter的“UI-as-a-code”方法,它们只用DART编写,这就提高了代码的可重用性。 效率与用户体验和界面密不可分。如前所述,Flutter不依赖于一组原生组件,而是利用可视化、结构化、平台性和交互式小部件进行UI的设计,所有这些都由框架的图形引擎呈现。更重要的是,Flutter留下了很大的定制空间,如果你想要设计一个很完美的UI,它是个很好的选择。 说到Flutter的更新,最新的稳定版本是在12月12日发布的,根据官方发布说明,它合并了来自188个贡献者的近2000个pull。例如,版本1.12.13中包括的改进: 重大的API变动。 新功能,例如SliverOpacity小部件和SliverAnimatedList。 修复了崩溃和性能问题。 Beta版中的Web支持。 这不是一个完整的清单,因为Flutter的目标是让每年发布的四个版本中的每一个版本都能为框架的可用性提升一个台阶。 Flutter是一个年轻的跨平台移动应用程序开发框架,所以它没有像React Native受到众多的大公司青睐也是不足为奇的。然而,这并不意味着它不好,截至2019年12月,它也为阿里巴巴、谷歌广告、Groupon等众多公司和业务所采用。 NativeScript 如果你要开始开发你的产品,“React Native”和“Flutter”绝不是唯一的解决方案。在 2020 年初,适合您的企业的替代框架也可能是 NativeScript。 这个开源框架于2015年3月公开发布,并迅速成为广受欢迎的解决方案。例如,在发布后的短短两个月内,它就获得了3000颗GitHub星标,并在Twitter上吸引了1500多名粉丝的关注。到今天为止,市场上已有超过700个插件可供选择。 在使用NativeScript构建跨平台应用程序时,开发人员首先用JavaScript及其超集TypeScript编写代码。然后,将代码库编译成各自平台原生的编程语言。 另外值得一提的是,使用 NativeScript 的开发人员也可以使用第三方库(CocoaPods 和 Android SDK),而无需包装。 与React Native类似,NativeScript允许访问Android和iOS原生API,这对跨平台应用程序有明显的积极影响。然而,不同之处在于,前者需要构建桥接API,而后者(用Progress首席开发者倡导者TJ VanToll的话说是“将所有iOS和Android API注入JavaScript虚拟机”)。与Facebook框架的另一个相似之处在于代码重用,在这两种情况下都可以达到90%。 Xamarin Xamarin开源框架创建于2011年,这使它成为了这个列表中最“古老“的框架,但直到五年前它被微软收购时,它才获得了发展势头。截至今天,它号称拥有超过6万名贡献者的社区。 从技术上讲,要用Xamarin构建跨平台的移动应用,需要很好地掌握.NET和C#两种技术,前者是使用多种语言(包括C#编程语言)、编辑器和库的开发平台。Xamarin用一组工具补充了上述平台,这些工具有助于构建跨平台应用程序,例如库、编辑器扩展和XAML。第二种技术是C#,这是一种面向对象的编程语言,它被认为比JavaScript学习起来稍难。Xamarin利用这种编程语言编写整个应用程序,从后端到原生API,再到业务逻辑。 Xamarin.Native和Xamarin.Forms Xamarin与其他框架的不同之处在于,它提供了两种编译跨平台移动应用的方式:Xamarin Native(也称为Xamarin.Android/iOS)和Xamarin.Forms。前一种方法优先考虑共享业务逻辑,并通过使用本机接口控件实现近乎本机的性能。 后者侧重于共享代码,而不是业务原理,这一方面会导致代码重用比例增加(使用Xamarin,开发人员可以重用高达96%的C#代码),但另一方面这样会降低代码性能。 您可能已经注意到,跨平台移动应用程序的性能和GUI密切相关,所以如果我说Xamarin构建应用程序的两种方法对界面的最终外观有很大影响,我可能不会感到惊讶。 Xamarin.Android/iOS允许开发人员使用原生控件和布局,而Xamarin.Forms基于标准UI元素,允许从单个API设计应用程序,但如果你需要更完美的原生UI,则可能还不够。 2020年跨平台应用程序开发还值得考虑吗? 不论如何,跨平台确实是一个值得考虑和极具前景的方向,特别是我们上面提到的 “React Native”和“Flutter”。 前者是一个成熟而稳定的框架,利用了最流行的编程语言之一,并拥有成熟的大型开发人员社区。后者是一个快速发展的技术,尽管它比React Native年轻的多,它也已经赢得了世界各地许多开发人员的青睐。 但无论您选择的是“React Native”、“Flutter”还是任何其他框架,跨平台方法都一定会为您节省时间和金钱,同时能为你最大限度地扩大市场覆盖范围。 最后,值不值得考虑,最终还是取决于你的业务目标、预算和时限。 来源;:葡萄城官网

问问小秘 2020-04-15 13:30:17 0 浏览量 回答数 0

问题

模板,从服务端到客户端

go696 2019-12-01 21:32:31 3535 浏览量 回答数 0

回答

为什么你的代码是一个单体? 除了已经实现了微前端的应用之外,所有前端应用本质上都是单一的应用。原因是如果您正在使用 React 库进行开发,并且如果您有两个团队,则两个团队都应该使用相同的React 库,并且两个团队应该在部署时保持同步,并且在代码合并期间始终会发生冲突。它们没有完全分离,很可能它们维护着相同的仓库并具有相同的构建系统。单体应用的退出被标志为微服务的出现。但是它适用于后端! 什么是微服务? 对于微服务,一般而言最简单的解释是,它是一种开发技术,允许开发人员为平台的不同部分进行独立部署,而不会损害其他部分。独立部署的能力允许他们构建孤立或松散耦合的服务。为了使这个体系结构更稳定,有一些规则要遵循,可以总结如下:每个服务应该只有一个任务,它应该很小。所以负责这项服务的团队应该很小。关于团队和项目的规模,James Lewis 和 Martin Fowler 在互联网上做出的最酷解释之一如下: 在我们与微服务从业者的对话中,我们看到了一系列服务规模。报道的最大规模遵循亚马逊关于Two Pizza Team的概念(即整个团队可以由两个比萨饼供给),意味着不超过十几个人。在规模较小的规模上,我们已经看到了一个由六人组成的团队支持六项服务的设置。 我画了一个简单的草图,为整体和微服务提供了直观的解释: 从上图可以理解,微服务中的每个服务都是一个独立的应用,除了UI。UI仍然是一体的!当一个团队处理所有服务并且公司正在扩展时,前端团队将开始苦苦挣扎并且无法跟上它,这是这种架构的瓶颈。 除了瓶颈之外,这种架构也会导致一些组织问题。假设公司正在发展并将采用需要 跨职能 小团队的敏捷开发方法。在这个常见的例子中,产品所有者自然会开始将故事定义为前端和后端任务,而 跨职能 团队将永远不会成为真正的 跨职能 部门。这将是一个浅薄的泡沫,看起来像一个敏捷的团队,但它将在内部分开。关于管理这种团队的更多信息将是一项非常重要的工作。在每个计划中,如果有足够的前端任务或者sprint中有足够的后端任务,则会有一个问题。为了解决这里描述的所有问题和许多其他问题,几年前出现了微前端的想法并且开始迅速普及。 解决微服务中的瓶颈问题:Micro Frontends 解决方案实际上非常明显,采用了多年来为后端服务工作的相同原则:将前端整体划分为小的UI片段。但UI与服务并不十分相似,它是最终用户与产品之间的接口,应该是一致且无缝的。更重要的是,在单页面应用时代,整个应用在客户端的浏览器上运行。它们不再是简单的HTML文件,相反,它们是复杂的软件,达到了非常复杂的水平。现在我觉得微型前端的定义是必要的: Micro Frontends背后的想法是将网站或Web应用视为独立团队拥有的功能组合。每个团队都有一个独特的业务或任务领域,做他们关注和专注的事情。团队是跨职能的,从数据库到用户界面开发端到端的功能。(micro-frontends.org) 根据我迄今为止的经验,对于许多公司来说,直接采用上面提出的架构真的很难。许多其他人都有巨大的遗留负担,这使他们无法迁移到新的架构。出于这个原因,更柔软的中间解决方案更加灵活,易于采用和安全迁移至关重要。在更详细地概述了体系结构后,我将尝试提供一些体系结构的洞察,该体系结构确认了上述提议并允许更灵活的方式。在深入了解细节之前,我需要建立一些术语。 整体结构和一些术语 让我们假设我们通过业务功能垂直划分整体应用结构。我们最终会得到几个较小的应用,它们与单体应用具有相同的结构。但是如果我们在所有这些小型单体应用之上添加一个特殊应用,用户将与这个新应用进行通信,它将把每个小应用的旧单体UI组合成一个。这个新图层可以命名为拼接图层,因为它从每个微服务中获取生成的UI部件,并为最终用户组合成一个无缝 UI,这将是微前端的最直接实现朗 为了更好地理解,我将每个小型单体应用称为微应用,因为它们都是独立的应用,而不仅仅是微服务,它们都有UI部件,每个都代表端到端的业务功能。 众所周知,今天的前端生态系统功能多样,而且非常复杂。因此,当实现真正的产品时,这种直接的解决方案还不够。 要解决的问题 虽然这篇文章只是一个想法,但我开始使用Reddit讨论这个想法。感谢社区和他们的回复,我可以列出一些需要解决的问题,我将尝试逐一描述。 当我们拥有一个完全独立的独立微应用时,如何创建无缝且一致的UI体验? 好吧,这个问题没有灵丹妙药的答案,但其中一个想法是创建一个共享的UI库,它也是一个独立的微应用。通过这种方式,所有其他微应用将依赖于共享的UI库微应用。在这种情况下,我们刚刚创建了一个共享依赖项, 我们就杀死了独立微应用的想法。 另一个想法是在根级共享CSS自定义变量( CSS custom variables )。此解决方案的优势在于应用之间的全局可配置主题。 或者我们可以简单地在应用团队之间共享一些SASS变量和混合。这种方法的缺点是UI元素的重复实现,并且应该对所有微应用始终检查和验证类似元素的设计的完整性。 我们如何确保一个团队不会覆盖另一个团队编写的CSS? 一种解决方案是通过CSS选择器名称进行CSS定义,这些名称由微应用名称精心选择。通过将该范围任务放在拼接层上将减少开发开销,但会增加拼接层的责任。 另一种解决方案可以是强制每个微应用成为自定义Web组件(custom web component)。这个解决方案的优点是浏览器完成了范围设计,但需要付出代价:使用shadow DOM进行服务器端渲染几乎是不可能的。此外,自定义元素没有100%的浏览器支持,特别是IE。 我们应该如何在微应用之间共享全局信息? 这个问题指出了关于这个主题的最关注的问题之一,但解决方案非常简单:HTML 5具有相当强大的功能,大多数前端开发人员都不知道。例如,自定义事件(custom events) 就是其中之一,它是在微应用中共享信息的解决方案。 或者,任何共享的pub-sub实现或T39可观察的实现都可以实现。如果我们想要一个更复杂的全局状态处理程序,我们可以实现共享的微型Redux,通过这种方式我们可以实现更多的相应式架构。 如果所有微应用都是独立应用,我们如何进行客户端路由? 这个问题取决于设计的每个实现, 所有主要的现代框架都通过使用浏览器历史状态在客户端提供强大的路由机制, 问题在于哪个应用负责路由以及何时。 我目前的实用方法是创建一个共享客户端路由器,它只负责顶级路由,其余路由器属于相应的微应用。假设我们有 /content/:id 路由定义。共享路由器将解析 /content,已解析的路由将传递到ContentMicroApp。ContentMicroApp是一个独立的服务器,它将仅使用 /:id 进行调用。 我们必须是服务器端渲染,但是有可能使用微前端吗? 服务器端呈现是一个棘手的问题。如果你正在考虑iframes缝合微应用然后忘记服务器端渲染。同样,拼接任务的Web组件也不比iframe强大。但是,如果每个微应用能够在服务器端呈现其内容,那么拼接层将仅负责连接服务器端的HTML片段。 与传统环境集成至关重要!但是怎么样? 为了整合遗留系统,我想描述我自己的策略,我称之为“ 渐进式入侵 ”。 首先,我们必须实现拼接层,它应该具有透明代理的功能。然后我们可以通过声明一个通配符路径将遗留系统定义为微应用:LegacyMicroApp 。因此,所有流量都将到达拼接层,并将透明地代理到旧系统,因为我们还没有任何其他微应用。 下一步将是我们的 第一次逐步入侵 :我们将从LegacyMicroApp中删除主要导航并用依赖项替换它。这种依赖关系将是一个使用闪亮的新技术实现的微应用:NavigationMicroApp 。 现在,拼接层将每个路径解析为 Legacy Micro App ,它将依赖关系解析为 Navigation MicroApp ,并通过连接这两个来为它们提供服务。 然后通过主导航遵循相同的模式来为引导下一步。 然后我们将继续从Legacy MicroApp中获取逐步重复以上操作,直到没有任何遗漏。 如何编排客户端,这样我们每次都不需要重新加载页面? 拼接层解决了服务器端的问题,但没有解决客户端问题。在客户端,在将已粘贴的片段作为无缝HTML加载后,我们不需要每次在URL更改时加载所有部分。因此,我们必须有一些异步加载片段的机制。但问题是,这些片段可能有一些依赖关系,这些依赖关系需要在客户端解决。这意味着微前端解决方案应提供加载微应用的机制,以及依赖注入的一些机制。 根据上述问题和可能的解决方案,我可以总结以下主题下的所有内容: 客户端 编排路由隔离微应用应用之间通信微应用UI之间的一致性 服务端 服务端渲染路由依赖管理 灵活、强大而简单的架构 所以,这篇文章还是很值得期待的!微前端架构的基本要素和要求终于显现! 在这些要求和关注的指导下,我开始开发一种名为microfe的解决方案。在这里,我将通过抽象的方式强调其主要组件来描述该项目的架构目标。 它很容易从客户端开始,它有三个独立的主干结构:AppsManager, Loader, Router 和一个额外的MicroAppStore。 AppsManager AppsManager 是客户端微应用编排的核心。AppsManager的主要功能是创建依赖关系树。当解决了微应用的所有依赖关系时,它会实例化微应用。 Loader 客户端微应用编排的另一个重要部分是Loader。加载器的责任是从服务器端获取未解析的微应用。 Router 为了解决客户端路由问题,我将 Router 引入了 microfe。与常见的客户端路由器不同,microf 的功能有限,它不解析页面而是微应用。假设我们有一个URL /content/detail/13 和一个ContentMicroApp。在这种情况下,microfe 将URL解析为 /content/,它将调用ContentMicroApp /detail/13 URL部分。 MicroAppStore 为了解决微应用到微应用客户端的通信,我将MicroAppStore引入了 microfe。它具有与Redux库类似的功能,区别在于:它对异步数据结构更改和reducer 声明更灵活。 服务器端部分在实现上可能稍微复杂一些,但结构更简单。它只包含两个主要部分 StitchingServer 和许多MicroAppServer。 MicroAppServer MicroAppServer 的最小功能可以概括为 init 和 serve。 虽然 MicroAppServer 首先启动它应该做的是使用 微应用声明 调用 SticthingServer 注册端点,该声明定义了 MicroAppServer 的微应用 依赖关系, 类型 和 URL架构。我认为没有必要提及服务功能,因为没有什么特别之处。 StitchingServer StitchingServer 为 MicroAppServers 提供注册端点。当 MicroAppServer 将自己注册到 StichingServer 时,StichingServer 会记录MicroAppServer 的声明。 稍后,StitchingServer 使用声明从请求的URL解析 MicroAppServers。 解析M icroAppServer 及其所有依赖项后,CSS,JS和HTML中的所有相对路径都将以相关的 MicroAppServer 公共URL为前缀。另外一步是为CSS选择器添加一个唯一的 MicroAppServer 标识符,以防止客户端的微应用之间发生冲突。 然后 StitchingServer 的主要职责就是:从所有收集的部分组成并返回一个无缝的HTML页面。 其他实现一览 甚至在2016年被称为微前端之前,许多大公司都试图通过 BigPipe 来解决Facebook等类似问题。如今这个想法正在获得验证。不同规模的公司对该主题感兴趣并投入时间和金钱。例如,Zalando开源了其名为Project Mosaic的解决方案。我可以说,微型和 Project Mosaic.遵循类似的方法,但有一些重要的区别。虽然microfe采用完全分散的路由定义来增强每个微应用的独立性,但Project Mosaic更喜欢每条路径的集中路由定义和布局定义。通过这种方式,Project Mosaic可以实现轻松的A/B测试和动态布局生成。 对于该主题还有一些其他方法,例如使用iframe作为拼接层,这显然不是在服务器端而是在客户端。这是一个非常简单的解决方案,不需要太多的服务器结构和DevOps参与。这项工作只能由前端团队完成,因此可以减轻公司的组织负担,同时降低成本。 已经有一个框架叫做 single-spa。该项目依赖于每个应用的命名约定来解析和加载微应用。容易掌握想法并遵循模式。因此,在您自己的本地环境中尝试该想法可能是一个很好的初步介绍。但是项目的缺点是你必须以特定的方式构建每个微应用,以便他们可以很好地使用框架。 最后的想法 我相信微前端话题会更频繁地讨论。如果该主题能够引起越来越多公司的关注,它将成为大型团队的事实发展方式。在不久的将来,任何前端开发人员都可以在这个架构上掌握一些见解和经验,这真的很有用。 关于本文 译者:@Vincent.W 译文:https://zhuanlan.zhihu.com/p/82965940 作者:@onerzafer 原文:https://hackernoon.com/understanding-micro-frontends-b1c11585a297 加入阿里云钉钉群享福利:每周技术直播,定期群内有奖活动、大咖问答 阿里云开发者社区

茶什i 2020-01-06 17:57:24 0 浏览量 回答数 0

回答

"主题前提 多语言站点包含三个不同方面: 界面翻译 内容 网址路由 尽管它们都以不同的方式互连,但是从CMS的角度来看,它们是使用不同的UI元素进行管理的,并且存储方式也不同。您似乎对自己的实现和对前两个的理解充满信心。问题是关于后一个方面的问题:“ URL转换?我们应该这样做吗?应该以什么方式进行?” URL可以由什么组成? 一个非常重要的事情是,不要对IDN感兴趣。取而代之的是支持音译(也:转录和罗马化)。乍一看,IDN似乎是国际URL的可行选择,但实际上,它不能按广告宣传工作,原因有两个: 某些浏览器会将非ASCII字符(例如'ч'或)'ž'转换为'%D1%87'和'%C5%BE' 如果用户具有自定义主题,则主题的字体很可能没有这些字母的符号 实际上,几年前,我在一个基于Yii的项目(可怕的框架,恕我直言)中尝试了IDN方法。在抓取该解决方案之前,我遇到了上述两个问题。另外,我怀疑这可能是攻击媒介。 可用选项...如我所见。 基本上,您有两个选择,可以抽象为: http://site.tld/[:query]:[:query]决定语言和内容选择的地方 http://site.tld/[:language]/[:query]:[:language]URL的一部分定义语言的选择,[:query]仅用于标识内容 查询是Α和Ω.. 假设您选择http://site.tld/[:query]。 在这种情况下,您有一种主要的语言来源:[:query]段的内容;以及另外两个来源: $_COOKIE['lang']该特定浏览器的价值 HTTP Accept-Language (1),(2)标头中的语言列表 首先,您需要将查询与定义的路由模式之一进行匹配(如果您选择的是Laravel,请在此处阅读)。成功匹配模式后,您需要查找语言。 您将必须遍历模式的所有部分。找到所有这些片段的潜在翻译,并确定使用哪种语言。当(不是“如果”)发生冲突时,将使用两个其他来源(cookie和标头)来解决路由冲突。 例如:http://site.tld/blog/novinka。 那是音译""блог, новинка"",在英语中大约是""blog"", ""latest""。 您已经注意到,俄语中的“блог”将译为“博客”。这意味着对于您的第一部分[:query](在最佳情况下),最终会['en', 'ru']列出可能的语言。然后您进入下一个片段-“ novinka”。可能的列表中可能只有一种语言:['ru']。 当列表中有一项时,您已经成功找到该语言。 但是,如果最终得到2种(例如:俄语和乌克兰语)或更多种可能性..或0种可能性(视情况而定)。您将必须使用Cookie和/或标题才能找到正确的选项。 如果其他所有方法均失败,则选择站点的默认语言。 语言作为参数 替代方法是使用URL,可以将其定义为http://site.tld/[:language]/[:query]。在这种情况下,翻译查询时,您无需猜测语言,因为此时您已经知道要使用哪种语言。 还有另一种语言来源:cookie值。但是,这里没有必要弄乱Accept-Language标头,因为在“冷启动”的情况下(当用户第一次使用自定义查询打开网站时),您不会处理未知数量的可能的语言。 相反,您有3个简单的优先选项: 如果[:language]设置了细分,请使用它 如果$_COOKIE['lang']设置,使用它 使用默认语言 使用该语言时,您只需尝试翻译查询,如果翻译失败,请对该特定段使用“默认值”(基于路由结果)。 这不是第三种选择吗? 是的,从技术上讲,您可以将两种方法结合使用,但这会使过程复杂化,并且只适合那些想要手动更改URL http://site.tld/en/news到http://site.tld/de/news并希望新闻页面更改为德语的人员。 但是即使是这种情况,也可以使用cookie值(其中包含有关先前选择语言的信息)缓解,以减少魔术和希望。 使用哪种方法? 您可能已经猜到了,我建议您将其http://site.tld/[:language]/[:query]作为更明智的选择。 同样在真实的单词情况下,URL中将包含第三大部分:“标题”。如在线商店中的产品名称或新闻站点中的文章标题。 例: http://site.tld/en/news/article/121415/EU-as-global-reserve-currency 在这种情况下'/news/article/121415'将是查询,而'EU-as-global-reserve-currency'标题是。纯粹用于SEO。 可以在Laravel中完成吗? Kinda,但默认情况下不是。 我不太熟悉它,但是据我所知,Laravel使用简单的基于模式的路由机制。要实现多语言URL,您可能必须扩展核心类,因为多语言路由需要访问不同形式的存储(数据库,缓存和/或配置文件)。 已路由。现在怎么办? 结果,您最终将获得两条有价值的信息:当前语言和查询的翻译段。然后,这些值可用于调度将产生结果的类。 基本上,以下网址:(http://site.tld/ru/blog/novinka或不含的版本'/ru')变成了类似 $parameters = [ 'language' => 'ru', 'classname' => 'blog', 'method' => 'latest', ]; 您仅用于调度的对象: $instance = new {$parameter['classname']}; $instance->{'get'.$parameters['method']}( $parameters ); ..或它的某些变体,具体取决于特定的实现。"来源:stack overflow

保持可爱mmm 2020-05-18 10:09:50 0 浏览量 回答数 0

回答

前言 前两天在 echarts 上寻找灵感的时候,看到了很多有关地图类似的例子,地图定位等等,但是好像就是没有地铁线路图,就自己花了一些时间捣鼓出来了这个交互式地铁线路图的 Demo,地铁线路上的点是在网上随便下载了一个,这篇文章记录自己的一些收获(毕竟我还是个菜鸟)以及代码的实现,希望能够帮到一些朋友。当然,如果有什么意见的可以直接跟我说,大家一起交流才会进步。 效果图 地图稍微内容有点多,要全部展示,字显得有点小了,但是没关系,可以按照需求放大缩小,字体和绘制的内容并不会失真,毕竟都是用矢量绘制的~ 界面生成 底层的 div 是通过 ht.graph.GraphView 组件生成的,然后就可以利用 HT for Web 提供好的方法,调用 canvas 画笔随便绘制就好,先来看看怎么生成底层 div: var dm = new ht.DataModel();//数据容器 var gv = new ht.graph.GraphView(dm);//拓扑组件 gv.addToDOM();//将拓扑图组件添加进body中 addToDOM 函数声明如下: addToDOM = function(){ var self = this, view = self.getView(), style = view.style; document.body.appendChild(view); //将组件底层div添加到body中 style.left = '0';//默认组件是绝对定位,所以要设置位置 style.right = '0'; style.top = '0'; style.bottom = '0'; window.addEventListener('resize', function () { self.iv(); }, false); //窗口变化事件 } 现在我就可以在这个 div 上乱涂乱画了~首先我获取下载好的地铁线路图上的点,我将它们放在 subway.js 中,这个 js 文件全部都是下载的内容,我没有做其他的改动,主要是将这些点根据线路来分分配添加到数组中,比如: mark_Point13 = [];//线路 数组内包含线路的起点和终点坐标以及这条线路的名称 t_Point13 = [];//换成站点 数组内包含线路中的换乘站点坐标以及换成站点名称 n_Point13 = [];//小站点 数组内包含线路中的小站点坐标以及小站点名称 mark_Point13.push({ name: '十三号线', value: [113.4973,23.1095]}); mark_Point13.push({ name: '十三号线', value: [113.4155,23.1080]}); t_Point13.push({ name: '鱼珠', value: [113.41548,23.10547]}); n_Point13.push({ name: '裕丰围', value: [113.41548,23.10004]}); 接下来来描绘地铁线路,我声明了一个数组 lineNum,用来装 js 中所有的地铁线路的编号,以及一个 color 数组,用来装所有的地铁线的颜色,这些颜色的 index 与 lineNum 中地铁线编号的 index 是一一对应的: var lineNum = ['1', '2', '3', '30', '4', '5', '6', '7', '8', '9', '13', '14', '32', '18', '21', '22', '60', '68']; var color = ['#f1cd44', '#0060a1', '#ed9b4f', '#ed9b4f', '#007e3a', '#cb0447', '#7a1a57', '#18472c', '#008193', '#83c39e', '#8a8c29', '#82352b', '#82352b', '#09a1e0', '#8a8c29', '#82352b', '#b6d300', '#09a1e0']; 接着遍历 lineNum,将 lineNum 中的元素和颜色传到 createLine 函数中,根据这两个参数来绘制地铁线路以及配色,毕竟 js 文件中的命名方式也是有规律的,哪一条线路,则命名后面一定会加上对应的数字,所以我们只需要将字符串与这个编号结合即可获得 js 中对应的数组了: let lineName = 'Line' + num; let line = window[lineName]; createLine 的定义也非常简单,我的代码设置了不少的样式,所以看起来有点多。创建一个 ht.Polyline 管线,我们可以通过 polyline.addPoint() 函数向这个变量中添加具体的点,通过 setSegments 可以设置点的连接方式。 function createLine(num, color) {//绘制地图线 var polyline = new ht.Polyline();//多边形 管线 polyline.setTag(num);//设置节点tag标签,作为唯一标示 if(num === '68') polyline.setToolTip('A P M');//设置提示信息 else if(num === '60') polyline.setToolTip('G F'); else polyline.setToolTip('Line' + num); if(color) { polyline.s({//s 为 setStyle 的简写,设置样式 'shape.border.width': 0.4,//设置多边形的边框宽度 'shape.border.color': color,//设置多边形的边框颜色 'select.width': 0.2,//设置选中节点的边框宽度 'select.color': color//设置选中节点的边框颜色 }); } let lineName = 'Line' + num; let line = window[lineName]; for(let i = 0; i < line.length; i++) { for(let j = 0; j < line[i].coords.length; j++) { polyline.addPoint({x: line[i].coords[j][0]*300, y: -line[i].coords[j][1]*300}); if(num === '68'){//APM线(有两条,但是点是在同一个数组中的) if(i === 0 && j === 0) { polyline.setSegments([1]); } else if(i === 1 && j === 0) { polyline.getSegments().push(1); } else { polyline.getSegments().push(2); } } } } polyline.setLayer('0');//将线设置在下层,点设置在上层“top” dm.add(polyline);//将管线添加进数据容器中储存,不然这个管线属于“游离”状态,是不会显示在拓扑图上的 return polyline; } 上面代码中添加地铁线上的点有分为几种情况,是因为 js 中设置线的时候 Line68 有一个“跳跃”点的现象,所以我们必须“跳跃”过去,篇幅有限 Line68 数组具体的声明自行看 subway.js。 这里说明一点,如果用的是 addPoint 函数,不设置 segments 时,默认将添加进的点用直线连接,segments 的定义如下: 1: moveTo,占用 1 个点信息,代表一个新路径的起点 2: lineTo,占用 1 个点信息,代表从上次最后点连接到该点 3: quadraticCurveTo,占用 2 个点信息,第一个点作为曲线控制点,第二个点作为曲线结束点 4: bezierCurveTo,占用 3 个点信息,第一和第二个点作为曲线控制点,第三个点作为曲线结束点 5: closePath,不占用点信息,代表本次路径绘制结束,并闭合到路径的起始点 所以我们要做“跳跃”的行为设置 segments 为 1 即可。 最后绘制这些地铁线上的点,这个部分 subway.js 中也分离出来了,命名以“mark_Point”、“t_Point”以及“n_Point”开头,我在前面 js 的展示部分有对这些数组进行解释,大家动动中指划上去看看。 我们在这些点的位置添加 ht.Node 节点,当节点一添加进 dm 数据容器中时,就会在拓扑图上显示,当然,前提是这个拓扑图组件 gv 设置的数据容器是这个 dm。篇幅有限,添加地铁线上的点的代码部分我只展示添加“换乘站点”的点: var tName = 't_Point' + num; var tP = window[tName];//大站点 if(tP) {//有些线路没有“换乘站点” for(let i = 0; i < tP.length; i++) { let node = createNode(tP[i].name, tP[i].value, color[index]);//在获取的线路上的点的坐标位置添加节点 node.s({//设置节点的样式style 'label.scale': 0.05,//文本缩放,可以避免浏览器限制的最小字号问题 'label.font': 'bold 12px arial, sans-serif'//设置文本的font }); node.setSize(0.6, 0.6);//设置节点大小。由于js中每个点之间的偏移量太小,所以我不得不把节点设置小一些 node.setImage('images/旋转箭头.json');//设置节点的图片 node.a('alarmColor1', 'rgb(150, 150, 150)');//attr属性,可以在这里面设置任何的东西,alarmColor1是在上面设置的image的json中绑定的属性,具体参看 HT for Web 矢量手册(http://www.hightopo.com/guide/guide/core/vector/ht-vector-guide.html#ref_binding) node.a('alarmColor2', 'rgb(150, 150, 150)');//同上 node.a('tpNode', true);//这个属性设置只是为了用来区分“换乘站点”和“小站点”的,后面会用上 } }

问问小秘 2020-01-07 11:16:33 0 浏览量 回答数 0

问题

程序员报错行为大赏-配置报错

问问小秘 2020-06-11 13:18:25 6 浏览量 回答数 1

问题

程序员报错QA大分享(1)

问问小秘 2020-06-18 15:46:14 8 浏览量 回答数 1
阿里云大学 云服务器ECS com域名 网站域名whois查询 开发者平台 小程序定制 小程序开发 国内短信套餐包 开发者技术与产品 云数据库 图像识别 开发者问答 阿里云建站 阿里云备案 云市场 万网 阿里云帮助文档 免费套餐 开发者工具 企业信息查询 小程序开发制作 视频内容分析 企业网站制作 视频集锦 代理记账服务 2020阿里巴巴研发效能峰会 企业建站模板 云效成长地图 高端建站 阿里云双十一主会场 阿里云双十一新人会场 1024程序员加油包 阿里云双十一拼团会场 场景化解决方案 阿里云双十一直播大厅