.NET-记一次架构优化实战与方案-前端优化

简介: .NET-记一次架构优化实战与方案-前端优化

前言

  

上一篇《.NET-记一次架构优化实战与方案-梳理篇》整理了基本的业务知识,同时也罗列了存在的问题,本篇主要是针对任务列表的页面进行性能优化。

  

该篇主要涉及的是代码实现上的优化,实现上的问题是战术债务,也就是我们平常出现的各种BUG,这种问题一出直接影响业务运营与系统运作。

  

你永远想象不到同一条SQL相差个3.5秒钟,遍历两次就导致了 3.5秒*2次 = 7秒的耗时。具体请看下文。


二八原则

  

有接触过性能问题的朋友应该都了解过,一般性能瓶颈都是在某行代码或者某个方法,而不是整一个代码实现流程。

  

例如:遍历计算、没使用到索引的SQL语句、多余重复的接口请求等等。

  

以二八原则的思想来考虑,80%性能耗时由20%的代码引起,因此我们处理原则就是具体定位,具体问题,针对解决。


现象描述

  

任务列表页面问题主要体现于加载任务列表过慢的性能低效问题,就如上一篇所说的加载事件需要11秒!这种对于用户来说是不能忍受的,特别是以现状JOB触发的方式时效如此低,用户多看两次,估计就会有放弃该产品的冲动。

  

因此我们需要遵守3秒钟原则。


3秒钟原则

  

现代人的生活节奏都很快,网页间的切换速度也越来越快。所谓“3秒钟原则”,就是要在极短的时间内展示重要信息,给用户留下深刻的第一印象。当然,这里的3秒只是一个象征意义上的快速浏览表述,在实际浏览网页的时候,并非真的严格遵守3秒。

  

因此,在设计互联网产品的页面时,用户等待时间越少,用户体验越好


优化实施

  

任务列表页面为以信息展示的读操作为主,因此对于 I/O 密集型程序,问题主要体现于两点:


  1. 慢查询语句
  2. 多次建立查询


多次建立查询

  

该问题主要从代码实现方式上解决,场景又分为两种情况:


信息重复查询

  

描述:函数 A 查询了一次 Users 信息,其函数 A 的子函数 B 又进行了一次查询了一次Users 信息。

  

解决方案:去除子函数 B 的重复查询,并提供参数由函数 A 传入


image.png

遍历查询


 

描述:item.foreach(item=> _userIdRespository.Get(a=>userId == item.userId) )

  

解决方案:先批量查询,然后在内存过滤。


var userIds = item.Select(a=>a.UserId);
  var users = _userIdRespository.ToList(a=>userIds .Contains(a.userId));
  Item.foreach(item=>{
  Var user = users .where(a=>a.userId == item.userId)
  })

 

以上并不是什么特别牛逼的技术,但是往往是某些地方性能瓶颈点,而导致这样的原因也只有一点,贪方便。上遍历查询的例子看出,两种写法的代码量的确差了几行,但是在实际使用场景中性能会差几倍,而且随着业务的增长其差距越发的明显。


慢查询语句

  

对可能出现慢查询的语句的进行日志埋点记录耗时(特别是手写 SQL 与复杂视图),定位后可与专业人士沟通优化,我们有DBA,因此我只要把问题定位到就好了。

  

下面展示一个我在优化时候遇到一个的情况:

  

优化前是查询一个复杂视图,因为查询没用到索引,单次查询了3.5秒,在生产环境还有遍历2次的情况,一个7秒。

  

优化后将视图改成存储过程,并通过业务了解到一个用户只会查询出一条记录,重复查的情况,耗时直接降到120+毫秒

image.png


优化经历

  

我刚完成这个需求二期上线,就收到加载慢的消息,整个优化过程并非一步到位的,主要分了三步:

  

第一步,能立刻可预见的,比较低级的优化了,并将列表加载改成异步,因为需求已经上线了,要先唬住用户。

  

第二步,把多次建立查询和部分已经在测试环境很慢的语句。优化完了之后发到了生产,快了2秒多,但是仍然不理想

  

第三步,给所有有可能查询慢的地方都写上日志,后来定位到了好几个慢查询,其中上面是罪魁祸首。

  

发布上线后,从原来的11秒耗时,降到1秒到2秒,细心的朋友会看见,在加载列表有一段UpdateUserTaskStatus的代码,这个是在读页面做更新操作,具体原因与分析放到下一篇进行讲解



目录
相关文章
|
6天前
|
缓存 前端开发 JavaScript
cnblogs——从主题开发浅谈前端性能优化
cnblogs——从主题开发浅谈前端性能优化
14 0
|
5天前
|
存储 NoSQL Java
一天五道Java面试题----第十一天(分布式架构下,Session共享有什么方案--------->分布式事务解决方案)
这篇文章是关于Java面试中的分布式架构问题的笔记,包括分布式架构下的Session共享方案、RPC和RMI的理解、分布式ID生成方案、分布式锁解决方案以及分布式事务解决方案。
一天五道Java面试题----第十一天(分布式架构下,Session共享有什么方案--------->分布式事务解决方案)
|
1天前
|
缓存 前端开发 JavaScript
优化前端性能的十大最佳实践
在现代网页开发中,前端性能优化不仅仅是为了提升用户体验,还能显著提高网站的加载速度和响应时间。本文探讨了十大最佳实践,从优化资源加载到减少网络请求,再到提高页面渲染效率,每个实践都旨在解决常见的性能瓶颈。通过实现这些策略,开发者可以显著提升前端性能,提升用户满意度,并确保网站在各种设备上的流畅运行。
|
1天前
|
缓存 前端开发 JavaScript
深入探讨前端性能优化:从理论到实践
在现代Web开发中,前端性能优化已成为提升用户体验的关键因素。本文将探讨前端性能优化的基本理论,并结合实际案例,深入分析如何通过优化代码、资源管理和用户交互,显著提升网站和应用的响应速度。我们将介绍从理论到实践的多种方法,包括资源压缩、异步加载、缓存机制及工具的使用,帮助开发者构建更加高效和用户友好的前端应用。
|
1天前
|
缓存 编解码 前端开发
优化Web应用性能的前端技巧:从加载时间到用户体验
在现代Web开发中,提升前端性能不仅仅是为了缩短页面加载时间,更是为了提供更流畅的用户体验。本文将探讨几种有效的前端优化技术,包括懒加载、代码拆分、资源压缩以及浏览器缓存策略。通过具体实例和最佳实践,读者将能够掌握如何系统地提高Web应用的响应速度,减少资源消耗,并最终改善用户的整体体验。
|
2天前
|
弹性计算 监控 数据挖掘
事件驱动架构的优势与应用:深度解析与实战应用
【8月更文挑战第17天】事件驱动架构以其松耦合、可扩展性、异步处理、实时性和高可靠性等优势,在实时数据处理、复杂业务流程、弹性伸缩和实时通信等多个领域展现出巨大的应用潜力。通过合理应用事件驱动架构,可以构建灵活、可扩展和可维护的系统架构,满足不断变化的业务需求和技术挑战。对于开发者而言,深入理解事件驱动架构的核心概念和优势,将有助于更好地设计和实现高质量的软件系统。
|
2天前
|
运维 安全 SDN
网络拓扑设计与优化:构建高效稳定的网络架构
【8月更文挑战第17天】网络拓扑设计与优化是一个复杂而重要的过程,需要综合考虑多方面因素。通过合理的拓扑设计,可以构建出高效稳定的网络架构,为业务的顺利开展提供坚实的支撑。同时,随着技术的不断进步和业务需求的不断变化,网络拓扑也需要不断优化和调整,以适应新的挑战和机遇。
用户态协议栈05—架构优化
用户态协议栈05—架构优化
|
4天前
|
缓存 前端开发 JavaScript
前端性能优化方案
【8月更文挑战第15天】前端性能优化方案
11 2
|
8天前
|
缓存 前端开发 API
优化前端性能的最佳实践
在构建高效的前端应用时,性能优化是不可忽视的关键因素。本文将探讨一些实用的前端性能优化策略,包括资源的懒加载、合理的缓存策略、代码分割以及异步数据加载等方法。通过实施这些最佳实践,可以显著提升应用的响应速度和用户体验。