- 前言 在AngularJS项目开发过程中,自己将遇到的问题进行了整理。回过头来总结一下angular的启动过程。 下面以实际项目为例进行简要讲解。1.载入ng库 2.等待,直到DOM树构造完毕。3.发现ng-app,自动进入启动引导阶段。4.根据ng-app名称找到相应的路由。 5.加载默认地址。6.Js顺序执行,加载相应模版页sys_tpls/home.html 7.在... 前言 在AngularJS项目开发过程中,自己将遇到的问题进行了整理。回过头来总结一下angular的启动过程。 下面以实际项目为例进行简要讲解。1.载入ng库 2.等待,直到DOM树构造完毕。3.发现ng-app,自动进入启动引导阶段。4.根据ng-app名称找到相应的路由。 5.加载默认地址。6.Js顺序执行,加载相应模版页sys_tpls/home.html 7.在...
- 假设我们使用 Angular Universal 开发一个服务器端渲染的 Angular 应用,这个应用会消费一个第三方的 Restful API. 本文分享如何通过创建 TransferState 服务来提高应用程序的效率,该服务是在 Node.js 服务器和浏览器中呈现的应用程序之间交换的一个键值注册表。 我们将通过一个 HTTP_INTERCEPTOR 机制来使用它,该机制将驻留在 Ht 假设我们使用 Angular Universal 开发一个服务器端渲染的 Angular 应用,这个应用会消费一个第三方的 Restful API. 本文分享如何通过创建 TransferState 服务来提高应用程序的效率,该服务是在 Node.js 服务器和浏览器中呈现的应用程序之间交换的一个键值注册表。 我们将通过一个 HTTP_INTERCEPTOR 机制来使用它,该机制将驻留在 Ht
- 本文分享作者在 Angular 开发过程中遇到的一个开启了服务器端渲染模式后,应用程序执行时遇到的错误消息的分析思路和解决方案。 在 Angular 应用开发中,我们在 TypeScript 代码里调用 localStorage. 本文分享 Angular 开发人员遇到错误消息 ReferenceError: localStorage is undefined 之后的分析思路。 本文分享作者在 Angular 开发过程中遇到的一个开启了服务器端渲染模式后,应用程序执行时遇到的错误消息的分析思路和解决方案。 在 Angular 应用开发中,我们在 TypeScript 代码里调用 localStorage. 本文分享 Angular 开发人员遇到错误消息 ReferenceError: localStorage is undefined 之后的分析思路。
- 本文介绍笔者在 Angular 服务器端渲染项目中学习到的开启缓存的经验分享。关于通过 Angular Universal 渲染出的页面源代码,我们有两种缓存方式:HTTP cache使用网络缓存时,一切都是为了在服务器上设置正确的响应标头。 它们指定缓存生存期和缓存策略。一个例子如下:Cache-Control: max-age = 31536000此选项适用于未经授权的区域和存在长时间不... 本文介绍笔者在 Angular 服务器端渲染项目中学习到的开启缓存的经验分享。关于通过 Angular Universal 渲染出的页面源代码,我们有两种缓存方式:HTTP cache使用网络缓存时,一切都是为了在服务器上设置正确的响应标头。 它们指定缓存生存期和缓存策略。一个例子如下:Cache-Control: max-age = 31536000此选项适用于未经授权的区域和存在长时间不...
- 本文介绍笔者在实际 Angular 开发项目中对 Rxjs 里 mergeMap 这个 Operator 的使用经验分享。注意:flatMap 是 mergeMap 的别名。如果一次只能激活一个内部订阅,请使用 switchMap.如果内部 observables 的发射和订阅顺序很重要,请使用 concatMap.当需要展平内部 observable 但想要手动控制内部订阅的数量时,是 m... 本文介绍笔者在实际 Angular 开发项目中对 Rxjs 里 mergeMap 这个 Operator 的使用经验分享。注意:flatMap 是 mergeMap 的别名。如果一次只能激活一个内部订阅,请使用 switchMap.如果内部 observables 的发射和订阅顺序很重要,请使用 concatMap.当需要展平内部 observable 但想要手动控制内部订阅的数量时,是 m...
- 当开发人员在 Dynatrace 中查看这些请求时,将无法再看到超时后正在进行的 API 调用。 该过程在后台进行渲染,但 Dynatrace 看到返回给客户端的响应并停止记录,在这种情况下,如果能了解它正在做的事情需要这么长时间,对分析问题会更有帮助。 当开发人员在 Dynatrace 中查看这些请求时,将无法再看到超时后正在进行的 API 调用。 该过程在后台进行渲染,但 Dynatrace 看到返回给客户端的响应并停止记录,在这种情况下,如果能了解它正在做的事情需要这么长时间,对分析问题会更有帮助。
- 本文介绍笔者在处理一个 customer incident,即关于 Angular 应用开启了服务器端渲染(SSR) 之后,出现请求超时的故障处理和解决方案。我们在控制台里能观察到如下和 timeout 相关的警告消息:Node Express server listening on http://localhost:4200SSR rendering exceeded timeout 20... 本文介绍笔者在处理一个 customer incident,即关于 Angular 应用开启了服务器端渲染(SSR) 之后,出现请求超时的故障处理和解决方案。我们在控制台里能观察到如下和 timeout 相关的警告消息:Node Express server listening on http://localhost:4200SSR rendering exceeded timeout 20...
- 本文通过一个实际的代码片段,来介绍如何使用浏览器原生 API setTinmeout,将 CPU 密集型的执行任务进行拆解,从而提高其在浏览器 UI 主线程里的执行效率,改善用户体验。未优化之前的版本:let i = 0;let start = Date.now();function count() { // do a heavy job for (let j = 0; j < 1e9;... 本文通过一个实际的代码片段,来介绍如何使用浏览器原生 API setTinmeout,将 CPU 密集型的执行任务进行拆解,从而提高其在浏览器 UI 主线程里的执行效率,改善用户体验。未优化之前的版本:let i = 0;let start = Date.now();function count() { // do a heavy job for (let j = 0; j < 1e9;...
- 企业级 JavaScript 应用部署在生产系统并运行后,如果出现性能问题,则找出引起这些性能问题的根源,往往不像找出引起运行时故障或者异常的根源那么简单。JavaScript 应用的性能问题往往表现在用户请求响应时间的下降,系统可用资源的降低甚至耗尽。本文介绍如何在生产系统通过各种工具来分析企业级 JavaScript 应用的性能瓶颈。 企业级 JavaScript 应用部署在生产系统并运行后,如果出现性能问题,则找出引起这些性能问题的根源,往往不像找出引起运行时故障或者异常的根源那么简单。JavaScript 应用的性能问题往往表现在用户请求响应时间的下降,系统可用资源的降低甚至耗尽。本文介绍如何在生产系统通过各种工具来分析企业级 JavaScript 应用的性能瓶颈。
- 本文探讨开源项目 Spartacus 的那些 peer dependencies 依赖关系的管理 本文探讨开源项目 Spartacus 的那些 peer dependencies 依赖关系的管理
- 需求 出于项目开发需求,需要实现的业务逻辑是:药店端点击查看“已发货”“已收货”订单详情时,模块弹出框中只应出现“取消”按钮。但现实的情况如下图所示。 模态框核心代码如下:<script type="text/ng-template" id="billDtlContent.html"> <div class="modal-header"> <... 需求 出于项目开发需求,需要实现的业务逻辑是:药店端点击查看“已发货”“已收货”订单详情时,模块弹出框中只应出现“取消”按钮。但现实的情况如下图所示。 模态框核心代码如下:<script type="text/ng-template" id="billDtlContent.html"> <div class="modal-header"> <...
- 一个具体的例子:combineLatest([ data$.pipe(startWith(null)), loading$,]).pipe( takeWhile(([data, loading]) => !data || loading, true), map(([data, loading]) => loading ? null : data), skip(1), distin... 一个具体的例子:combineLatest([ data$.pipe(startWith(null)), loading$,]).pipe( takeWhile(([data, loading]) => !data || loading, true), map(([data, loading]) => loading ? null : data), skip(1), distin...
- 前言 项目开发过程中,移动端新近增加了一个功能“微信授权登录”,由于自己不是负责移动端开发的,但最后他人负责的部分未达到预期效果。不能准确实现微信授权登录。最后还得靠自己做进一步的优化工作,谁让自己是负责人呢?原来负责人就是负责最后把所有的BUG解决掉。 首先,熟悉一下微信授权部分的源代码,如下所示:/*-------------- 微信授权登陆 ------... 前言 项目开发过程中,移动端新近增加了一个功能“微信授权登录”,由于自己不是负责移动端开发的,但最后他人负责的部分未达到预期效果。不能准确实现微信授权登录。最后还得靠自己做进一步的优化工作,谁让自己是负责人呢?原来负责人就是负责最后把所有的BUG解决掉。 首先,熟悉一下微信授权部分的源代码,如下所示:/*-------------- 微信授权登陆 ------...
- angular控制器通信的方式有三种: 1,利用作用域继承的方式。即子控制器继承父控制器中的内容 2,基于事件的方式。即$on,$emit,$boardcast这三种方式 3,服务方式。写一个服务的单例然后通过注入来使用利用作用域的继承方式由于作用域的继承是基于js的原型继承方式,所以这里分为两种情况,当作用域上面的值为基本类型的时候,修改父作用域上面的值会影响到子作用域,反之,修改子作用域... angular控制器通信的方式有三种: 1,利用作用域继承的方式。即子控制器继承父控制器中的内容 2,基于事件的方式。即$on,$emit,$boardcast这三种方式 3,服务方式。写一个服务的单例然后通过注入来使用利用作用域的继承方式由于作用域的继承是基于js的原型继承方式,所以这里分为两种情况,当作用域上面的值为基本类型的时候,修改父作用域上面的值会影响到子作用域,反之,修改子作用域...
- 我们先看 Angular 里一个常规的使用 Ngrx Store 的例子:上面这段代码的缺陷是,Component 作为 UI 的展现层,直接依赖于作为第三方库的 Store API —— 一个合乎逻辑的措施是,将这个逻辑通过 facade 服务的思路,抽取到一个 service 中,以保护 Component 免受库弃用或破坏性更改(breaking changes)的影响。在 Angul... 我们先看 Angular 里一个常规的使用 Ngrx Store 的例子:上面这段代码的缺陷是,Component 作为 UI 的展现层,直接依赖于作为第三方库的 Store API —— 一个合乎逻辑的措施是,将这个逻辑通过 facade 服务的思路,抽取到一个 service 中,以保护 Component 免受库弃用或破坏性更改(breaking changes)的影响。在 Angul...
上滑加载中
推荐直播
-
HDC深度解读系列 - Serverless与MCP融合创新,构建AI应用全新智能中枢
2025/08/20 周三 16:30-18:00
张昆鹏 HCDG北京核心组代表
HDC2025期间,华为云展示了Serverless与MCP融合创新的解决方案,本期访谈直播,由华为云开发者专家(HCDE)兼华为云开发者社区组织HCDG北京核心组代表张鹏先生主持,华为云PaaS服务产品部 Serverless总监Ewen为大家深度解读华为云Serverless与MCP如何融合构建AI应用全新智能中枢
回顾中 -
关于RISC-V生态发展的思考
2025/09/02 周二 17:00-18:00
中国科学院计算技术研究所副所长包云岗教授
中科院包云岗老师将在本次直播中,探讨处理器生态的关键要素及其联系,分享过去几年推动RISC-V生态建设实践过程中的经验与教训。
回顾中 -
一键搞定华为云万级资源,3步轻松管理企业成本
2025/09/09 周二 15:00-16:00
阿言 华为云交易产品经理
本直播重点介绍如何一键续费万级资源,3步轻松管理成本,帮助提升日常管理效率!
回顾中
热门标签