干货 | 前端如何实现业务解耦,携程酒店查询首页的1.0到3.0

前后端分离&解耦 Web实现前后端分离,前后端解耦 一、前言 ”前后端分离“已经成为互联网项目开发的业界标杆,通过Tomcat+Ngnix(也可以中间有个Node.js),有效地进行解耦。并且前后端分离会为以后的大型分布式架构、弹性计算架构、微服务架构、多端化服务(多种客户端,例如:浏览器,车载终端,安卓,IOS等等)打下坚实的基础。 前后端分离(解耦)的核心思想是:前端Html页面通过Ajax调用后端的RestFul API并使用Json数据进行交互。 注:【在互联网架构中,web服务器:一般指像nginx,apache这 阅读详情

作者简介

何金,携程酒店研发部Android资深软件开发工程师,负责酒店代码性能优化、结构改造、疑难问题排查处理,以及Kotlin的推广和应用。


酒店查询首页,是用户使用携程APP进行酒店预订的第一个页面。它提供了各种类型的酒店筛选入口,让用户进行酒店选择。随着查询首页版本不断迭代,其对应业务,功能和样式经历了由简单到复杂,单一到丰富的过程。


为了更好的适应业务的快速迭代,查询首页的结构也经历了多个版本优化和重构。本文将分享携程酒店是如何根据查询首页自身业务需求特点,进行代码结构优化和重构的。


根据查询首页不同时期业务和代码结构特点,简单的把结构迭代版本划分为三个版本。分别对应简单的1.0,头疼的2.0,合适的3.0。


640?wx_fmt=jpeg


1.0



1.0版本是酒店查询首页最早期的一个版本,它所包含的业务可以简单的由上到下做垂直划分,顶部的标题模块,中间提供给用户进行输入的查询模块,以及酒店底部推荐模块。如下图所示:


640?wx_fmt=png

 

根据这种业务特点,将不同业务模块抽象为不同的Fragment。将这些Fragment统一放到ScrollView中进行布局,InuqireCacheBean用来管理Fragment的数据,具体的结构如下图:


640?wx_fmt=png


从上图看,1.0采用的是典型的MVC模式。结构清晰明了,但是业务逻辑代码和样式布局全部耦合在相应的Fragment里。如果一直维持这个结构,那么随着业务不断迭代和增加,Fragment里面的代码会越来越臃肿,业务的实现成本和排查问题的难度都会越来越大。


2.0



下面的三张贴图是2.0版本时期新增的一些业务所对应的样式。

 

640?wx_fmt=png

        

2.0版本查询页的功能和样式比1.0都要丰富和复杂很多。根据这种特点,对查询页进行了模块化拆分,把不同的业务抽象成对应的Moudle,通过Module管理自身业务和UI布局。

      

640?wx_fmt=png

      

上图是查询首页2.0的架构图,它的容器仍然是HotelInquireActvity,通过ScrollView

管理TitleFragment, InquireCoreFragment,RecommendFragment和BottomFragment。


BottomFragment是2.0新增的一个Fragment,它目的是展示和管理查询首页底部新增的Moudle。Module的设计采用MVP模式, BizMoudle代表V层,会向外暴露一个getView接口,用来展示该业务的样式,BizMoudlePresenter代表P层,用于处理业务逻辑,BizMoudleRepositery代表M层,用于处理数据。Module的结构如下图:


640?wx_fmt=png

 

InquireBizConfig是各个业务Module配置管理器,用于管理加载不同业务对应Module。InquireBizConfig由两部分组成,一是BizConfig,二是BizManager。


BizConfig内部核心是一个Map数据结构,用于注册查询首页需要用到的所有Module,BizManager内部核心是一个List数据结构,用于加载和定义各个业务Moudle的展示位置顺序。


当BottomFragment加载启动的时候,会调用BizManager里面的startLoadMoudles()方法,这个方法会遍历List,取出相应的Moudle加载到BottomFragment中,它的结构如下图所示。


640?wx_fmt=png

 

从2.0架构图看,对查询首页业务进行了模块化拆分,可以方便团队中不同业务的开发Owner进行同时开发,减少了相互的干扰,提高了业务需求的交付效率,但美中不足的是结构没有做到统一。


有的业务以Fragment形式存在,有的业务以Module形式存在。该结构还会存在性能黑洞,当BottomFragment启动时,会加载所有配置的Moudle,把所有Moudle的View加载到布局容器ScrollView中,无论这些Moudle是否在第一屏展示,影响查询首页的启动性能。


另外由于布局容器采用的ScrollView,如果业务Module里面采用了ListView控件,EditText控件等,那开发必须使用额外的逻辑去处理ScrollView和这些控件带来的兼容性问题。布局容器采用的ScrollView,带来的交互实现成本也很高。


3.0


 

为了解决2.0结构存在的问题,我们又进行了3.0版本迭代。


3.0版本主要围绕2.0版本存在的两个问题,一是根布局使用ScrollView带来的性能和兼容性问题;二是结构没有统一,业务分别以Module和Fragment形式存在的问题。


针对ScrollView产生的问题,分别选择了三种可替代ScrollView的方案。


第一种是使用RecyclerView, 通过Type来区别各个业务对应的布局,这个方案是理论上行的通的,但是需要改造各个Moudle对应的数据结构,需要将不用业务的数据结构进行结构统一,改造成本太高,实现起来难度和风险较高。


第二种采用酒店内部控件GroupListView控件,该控件的核心是基于ListView,它是将不同的Adapter融合到一个Adapter中。


第三种方案是使用开源组件Vlayout,该控件的实质是异构的RecylerView,原理和GroupListView相似。


对比第二种和第三种方案,RecyclerView解决了ListView不能局部刷新的问题,另外RecyclerView设计上采用四级缓存,在性能上也比ListView更优,可为查询首页将来支持流畅性较高的复杂交互做好准备。


基于以上考虑,选择第三种方案替代ScrollView。对之前2.0存在的TitleFrament,InquireCoreFragment,ReCommendFragment进行模块化改造,分别改成为TitleModule,InquireCoreModule,ReCommendModule,移除2.0作为Mudule容器的BottomFragment。经过改造后,3.0的结构图如下:


640?wx_fmt=png

  

经过了3.0版本的结构迭代和优化,所有的模块都统一抽象为了Moudle,结构变得更加清晰简单。采用Vlayout替代ScrollView,解决了2.0结构版本中潜在的性能黑洞问题,同时Vlayout提供了大量的UI模板,避免了前端重复造轮子,提高了业务交付效率。


小结



酒店查询首页经过三个版本迭代和优化,结构趋于稳定,为查询首页的未来业务快速交付和生产环境稳定打下了良好基础。


在对酒店查询首页优化和改造时,根据我们团队的特点,采用了渐进式的架构迭代思路,这样既保证了业务需求的交付,也避免了重构带来的风险。


同时也给前端如何实现业务解耦,如何在保证页面性能的前提条件下,承载大量不同的UI布局元素提供一种优化借鉴思路。


【推荐阅读】




640?wx_fmt=jpeg


前端代码如何解耦 仔细地讲解了前端代码如何解耦,对于前端工程师大有裨益的 立即下载

相关推荐

酒店前端界面

酒店前台,用户的登陆注册,查看房间信息,地图的展现

写出高质量的前端代码之降低耦合提升正交性

整理了一套《前端大厂面试宝典》,包含了HTML、CSS、JavaScript、HTTP、TCP协议、浏览器、VUE、React、数据结构和算法,一共201道面试题,并对每个问题作出了回答和解析。有需要的小伙伴,可以点击文末卡片领取这份文档,无偿分享部分文档展示:文章篇幅有限,后面的内容就不一一展示了有需要的小伙伴,可以点下方卡片免费领取。

老司机的后备箱 1350

前端页面酒店

前端 页面 酒店 前端 页面 酒店 前端 页面 酒店 前端 页面 酒店 前端 页面 酒店

前端代码重构和解耦

前端代码重构主要有下面几点一、删除无用代码,精简代码1、删除无用的css和javascript,删除javascript中已经无用的方法二、前端代码规范1、把页面中内联样式及头部样式提取到单独的css文件中 2、调整代码的缩进 3、更改标注已经不支持的标签如: 4、在javascript中减少全局变量的使用,缩小变量的作用域 5、整理基础类库,减少因为版本的问题造成多个文件三、前端代码模块化

inyiyi的博客 4705

YOLO26算法心电图十二导联目标检测+训练好的模型+368张数据集+pyqt可视化界面.zip

附训练好的 YOLO 权重与 PyQt 可视化检测界面,页面底部含可视化效果预览,毕设/课设开箱即用。 【数据集概况】 · 检测类别(中文):[导联I(I), 导联II(II), 导联III(III), 胸导联V1(V1), 胸导联V2(V2), 胸导联V3(V3), 胸导联V4(V4), 胸导联V5(V5), 胸导联V6(V6), 加压肢体导联aVF(aVF), 加压肢体导联aVL(aVL), 加压肢体导联aVR(aVR)] · 训练集:313 张 · 验证集:37 张 · 测试集:18 张 · 总计:368 张 该数据集聚焦于临床心电图信号的精准识别与定位,其核心检测目标为标准12导联心电图中的各个独立导联波形区域,涵盖肢体导联(I、II、III)与加压肢体导联(aVR、aVL、aVF),以及胸前导联(V1至V6),适用于心电图自动分析系统中对各导联位置的快速准确标注与分类。数据采集场景真实还原了医院心电图室或急诊监护环境下的标准心电图记录纸,波形清晰、基线稳定,具有高度临床参考价值。... 【训练曲线与评估图】 【模型训练配置】 参数 | 值 模型 | yolo26n 训练轮数 | 100 epochs 输入尺寸 | 640x640 批次大小 | 24 优化器 | auto 初始学习率 | 0.01 训练设备 【关键指标汇总】 训练了 57 个 epoch,最终轮指标: 指标 | 数值 mAP50 | **0.9708** mAP50-95 | 0.6344 Precision | 0.8990 Recall | 0.9191 train/box_loss | 1.2231 train/cls_loss | 0.9703 val/box_loss | 1.2779 val/cls_loss | 0.... 使用场景:毕业设计、课程设计、深度学习入门、工业场景落地验证。

pytorch多层感知机实现假钞识别(完整项目构建)

目录1 项目构建2 超参数设置 config.py3 数据集预处理 preprocess.py4 数据集类构建 dataset_banknote.py5 模型构建 model.py6 训练trainer.py6.1 查看损失曲线7 在测试集上运行 inference.py 1 项目构建 构建项目文件夹Banknote,以及子文件夹与py文件。 名称 作用 data目录 存放原始数据与预处理后切分为训练集、验证机、测试集的数据 log目录 存放训练过程中保存的指标,如损失、精确度等

Demon_LMMan的博客 2026

请说明Vue中的解耦能力

Vue中的解耦能力是指在Vue框架中,我们能够有效地将代码分离成独立的组件或模块,使得这些组件之间的依赖关系减少,实现高内聚、低耦合的设计目标

有我更精彩的博客 920

COMSOL电弧放电仿真:四场耦合与磁流体建模实战指南

多物理场耦合仿真是现代工程中模拟复杂物理过程的重要手段。电弧本质上是电场、磁场、流场与温度场四场相互耦合的非线性系统,其行为由磁流体力学(MHD)方程描述。通过COMSOL等工具构建电弧模型,可准确预测温度分布、流场结构和电极烧蚀,为开关电器设计、等离子体应用等提供数据支撑。在高压电器开断、电弧切割、激光打孔等工程问题中,高效求解MHD耦合模型是关键。然而,电弧仿真涉及物性参数强非线性、边界条件设置、求解器配置以及移动网格处理等挑战。以二维轴对称电弧模型为例,系统梳理磁流体方程落地、多物理场耦合节点配置、收

weixin_30047059的博客 134

前端组件解耦利器:发布订阅模式

虽然像 Redux, Vuex, Pinia 这样的状态管理库有自己的机制,但有时在它们之外,或者在不使用这些库的小型项目中,可以使用 Event Bus 来响应某些状态相关的变化,通知相关组件更新。因此,在使用时需要权衡利弊,遵循最佳实践(特别是取消订阅),并避免滥用,将其用在最适合的场景(如复杂的跨组件通信、模块解耦等),才能真正发挥其价值。这些组件之间经常需要通信和协作。它通过引入一个中介(事件总线),使得组件间的通信可以间接进行,降低了组件之间的依赖关系,提高了代码的可维护性和可扩展性。

程序员成长指北 353

LVGL8.x 实体按键与Keypad驱动的无缝对接实战

本文详细解析了LVGL8.x中实体按键与Keypad驱动的两种对接方案:坐标映射的Button方式与事件驱动的Keypad方式。重点阐述了如何模块化裁剪lv_port_indev.c模板文件,并深入讲解了Keypad驱动与Group焦点管理系统的核心协作机制,为无触摸屏的嵌入式设备提供流畅的UI交互解决方案。

weixin_29164497的博客 446

别再死磕U-Net了!用PyTorch手把手教你搭建ResUnet,搞定医学图像分割(附完整代码)

本文详细介绍了如何利用PyTorch搭建ResUnet模型,通过引入残差连接解决医学图像分割中的梯度消失、特征退化和细节丢失问题。与传统U-Net相比,ResUnet在Dice系数和收敛速度上均有显著提升,特别适合处理脑部MRI等复杂医学图像。文章还提供了完整的代码实现和关键训练技巧,帮助开发者快速掌握这一先进技术。

weixin_42552637的博客 327

VueX解耦:前端开发的音乐大师

VueX解耦是前端开发中不可忽视的重要议题,它能够帮助我们构建更加灵活、可维护和可扩展的应用。通过合理利用技巧和模式,我们可以在前端世界中找到和谐的旋律,让代码更加优雅,开发更加愉悦。

weixin_47238919的博客 358

DETRs with Collaborative Hybrid Assignments Training论文阅读与代码

在这篇论文中,作者观察到在DETR中将过少的 Query 分配为正样本,采用一对一的集合匹配,会导致对编码器输出的监督稀疏,严重损害编码器的区分特征学习,反之亦然,也会影响解码器中的注意力学习。为了缓解这个问题,作者提出了一种新颖的协同混合分配训练方案,名为Co-DETR,以从多样的标签分配方式中学习更高效、更有效的基于DETR的检测器。这种新的训练方案可以通过训练多个并行辅助 Head ,以一对多的标签分配方式(如ATSS和Faster RCNN)进行监督,轻松增强端到端检测器中编码器的学习能力。

qingjing0413的博客 1153

前端开发中的解耦

在知乎上看到一个问题:“怎么才能知道自己的编程水平?”。   排名第一的mu peng的回答是:   看需求。如果需求改了一点,自己的代码就要推倒重来,这说明还需努力。如果需求改了很多,客户,PM都觉得很不好意思,自己勉为其难的答应了。可是回去半天就改完了,测试基本没有bug。这就说明水平不错了。谢邀。   看到此回答,受益匪浅。于是想到了自己的前端开发工作。   我觉着在开发...

MirrorAvatar的专栏 1612

基于多传感器融合的智身四足机器狗楼梯环境SLAM系统设计与实现

本文设计了一种基于多传感器融合的四足机器狗楼梯环境SLAM系统。系统采用Jetson Orin NX为主控制器,集成RealSense D435i深度相机和Livox Mid360激光雷达,在ROS2框架下实现平面定位精度<5cm、楼梯环境下导航不漂移的目标。通过多层次传感器融合策略、运动学约束优化和状态切换机制,解决了楼梯环境下的定位累积误差问题,实现了平面与楼梯环境的自动识别切换及精度复位功能。硬件设计注重传感器布局优化和精确标定,软件架构采用分层设计,确保实时性能。该系统为四足机器人在复杂地形中

huanghm88的专栏 238

[HBM] RAM Cell Self Repair | 内存单元自我修复

对抗错误的大都是冗余,内存颗粒在设计的时候也考虑增加冗余。具体的说:添加冗余或备用的存储单元行和列,及时将测试中的故障进行修复和替换,存储器修复包括行修复,列修复或两者的组合。

串起点滴 783

前后端分离架构概述

1、背景 &amp;amp;nbsp;&amp;amp;nbsp;&amp;amp;nbsp;&amp;amp;nbsp;&amp;amp;nbsp;&amp;amp;nbsp; 前后端分离已成为互联网项目开发的业界标准使用方式,通过nginx+tomcat的方式(也可以中间加一个nodejs)有效的进行解耦,并且前后端分离会为以后的大型分布式架构、弹性计算架构、微服务架构、多端化服务(多种客户端,例如:浏览器,车载终端,安卓,IOS等等)打下坚实的基础。这

Hopefully Sky的博客 24万+

[ vulhub漏洞复现篇 ] Jetty WEB-INF 文件读取复现CVE-2021-34429

[ vulhub漏洞复现篇 ] Jetty WEB-INF 文件读取复现CVE-2021-34429 可以使用一些编码字符来制作URI,以访问WEB-INF目录的内容和/或绕过一些安全限制。默认合规模式允许带有包含 %u002e 段的 URI 的请求访问WEB-INF目录中的受保护资源。

qq_51577576的博客 3208

阿里资深技术专家:如何对复杂的业务系统进行解耦和重构?

要明白实际上微服务后续出现的诸多问题往往都是一开始微服务模块划分就不合理导致,对于具体的模块划分方法和原则,我在上面文章里面给出了以下几点。 原则1:划分为<10个微服务模块 原则2:强数据关联模块不要拆分 原则3:以数据聚合驱动业务功能聚合 原则4:从纵向功能划分思路到横向分层思路转变 原则5:高内聚,松耦合的基础原则 对于具体的内容在这篇文章不再重复给出。可以看到对于微服务模块拆分更多的是属于业务建模和系统分析方面的内容,而今天谈的微服务解耦重点是

一个天秤座的架构师 3万+

深度学习工具包 DeepLearningToolbox

深度学习工具包Deprecation notice.-----This toolbox is outdated and no longer maintained.There are much better tools available for deep learning than this toolbox, e.g. [Theano](http://deeplearning.net/software/theano/), [torch](http://torch.ch/) or [tensorflow](http://www.tensorflow.org/)I would suggest you use one of the tools mentioned above rather than use this toolbox.Best, Rasmus.DeepLearnToolbox================A Matlab toolbox for Deep Learning.Deep Learning is a new subfield of machine learning that focuses on learning deep hierarchical models of data.It is inspired by the human brain&#39;s apparent deep (layered, hierarchical) architecture.A good overview of the theory of Deep Learning theory is[Learning Deep Architectures for AI](http://www.iro.umontreal.ca/~bengioy/papers/ftml_book.pdf)For a more informal introduction, see the following videos by Geoffrey Hinton and Andrew Ng.* [The Next Generation of Neural Networks](http://www.youtube.com/watch?v=AyzOUbkUf3M) (Hinton, 2007)* [Recent Developments in Deep Learning](http://www.youtube.com/watch?v=VdIURAu1-aU) (Hinton, 2010)* [Unsupervised Feature Learning and Deep Learning](http://www.youtube.com/watch?v=ZmNOAtZIgIk) (Ng, 2011)If you use this toolbox in your research please cite [Prediction as a candidate for learning deep hierarchical models of data](http://www2.imm.dtu.dk/pubdb/views/publication_details.php?id=6284)```@MASTERSTHESIS\{IMM2012-06284, author = "R. B. Palm", title = "Prediction as a candidate for learning deep hierarchical models of data", year = "2012",}```Contact: rasmusbergpalm at gmail dot comDirectories included in the toolbox-----------------------------------`NN/` - A library for Feedforward Backpropagation Neural Networks`CNN/` - A library for Convolutional Neural Networks`DBN/` - A library for Deep Belief Networks`SAE/` - A library for Stacked Auto-Encoders`CAE/` - A library for Convolutional Auto-Encoders`util/` - Utility functions used by the libraries`data/` - Data used by the examples`tests/` - unit tests to verify toolbox is workingFor references on each library check REFS.mdSetup-----1. Download.2. addpath(genpath(&#39;DeepLearnToolbox&#39;));Example: Deep Belief Network---------------------```matlabfunction test_example_DBNload mnist_uint8;train_x = double(train_x) / 255;test_x = double(test_x) / 255;train_y = double(train_y);test_y = double(test_y);%% ex1 train a 100 hidden unit RBM and visualize its weightsrand(&#39;state&#39;,0)dbn.sizes = [100];opts.numepochs = 1;opts.batchsize = 100;opts.momentum = 0;opts.alpha = 1;dbn = dbnsetup(dbn, train_x, opts);dbn = dbntrain(dbn, train_x, opts);figure; visualize(dbn.rbm{1}.W&#39;); % Visualize the RBM weights%% ex2 train a 100-100 hidden unit DBN and use its weights to initialize a NNrand(&#39;state&#39;,0)%train dbndbn.sizes = [100 100];opts.numepochs = 1;opts.batchsize = 100;opts.momentum = 0;opts.alpha = 1;dbn = dbnsetup(dbn, train_x, opts);dbn = dbntrain(dbn, train_x, opts);%unfold dbn to nnnn = dbnunfoldtonn(dbn, 10);nn.activation_function = &#39;sigm&#39;;%train nnopts.numepochs = 1;opts.batchsize = 100;nn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.10, &#39;Too big error&#39;);```Example: Stacked Auto-Encoders---------------------```matlabfunction test_example_SAEload mnist_uint8;train_x = double(train_x)/255;test_x = double(test_x)/255;train_y = double(train_y);test_y = double(test_y);%% ex1 train a 100 hidden unit SDAE and use it to initialize a FFNN% Setup and train a stacked denoising autoencoder (SDAE)rand(&#39;state&#39;,0)sae = saesetup([784 100]);sae.ae{1}.activation_function = &#39;sigm&#39;;sae.ae{1}.learningRate = 1;sae.ae{1}.inputZeroMaskedFraction = 0.5;opts.numepochs = 1;opts.batchsize = 100;sae = saetrain(sae, train_x, opts);visualize(sae.ae{1}.W{1}(:,2:end)&#39;)% Use the SDAE to initialize a FFNNnn = nnsetup([784 100 10]);nn.activation_function = &#39;sigm&#39;;nn.learningRate = 1;nn.W{1} = sae.ae{1}.W{1};% Train the FFNNopts.numepochs = 1;opts.batchsize = 100;nn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.16, &#39;Too big error&#39;);```Example: Convolutional Neural Nets---------------------```matlabfunction test_example_CNNload mnist_uint8;train_x = double(reshape(train_x&#39;,28,28,60000))/255;test_x = double(reshape(test_x&#39;,28,28,10000))/255;train_y = double(train_y&#39;);test_y = double(test_y&#39;);%% ex1 Train a 6c-2s-12c-2s Convolutional neural network %will run 1 epoch in about 200 second and get around 11% error. %With 100 epochs you&#39;ll get around 1.2% errorrand(&#39;state&#39;,0)cnn.layers = { struct(&#39;type&#39;, &#39;i&#39;) %input layer struct(&#39;type&#39;, &#39;c&#39;, &#39;outputmaps&#39;, 6, &#39;kernelsize&#39;, 5) %convolution layer struct(&#39;type&#39;, &#39;s&#39;, &#39;scale&#39;, 2) %sub sampling layer struct(&#39;type&#39;, &#39;c&#39;, &#39;outputmaps&#39;, 12, &#39;kernelsize&#39;, 5) %convolution layer struct(&#39;type&#39;, &#39;s&#39;, &#39;scale&#39;, 2) %subsampling layer};cnn = cnnsetup(cnn, train_x, train_y);opts.alpha = 1;opts.batchsize = 50;opts.numepochs = 1;cnn = cnntrain(cnn, train_x, train_y, opts);[er, bad] = cnntest(cnn, test_x, test_y);%plot mean squared errorfigure; plot(cnn.rL);assert(er<0.12, &#39;Too big error&#39;);```Example: Neural Networks---------------------```matlabfunction test_example_NNload mnist_uint8;train_x = double(train_x) / 255;test_x = double(test_x) / 255;train_y = double(train_y);test_y = double(test_y);% normalize[train_x, mu, sigma] = zscore(train_x);test_x = normalize(test_x, mu, sigma);%% ex1 vanilla neural netrand(&#39;state&#39;,0)nn = nnsetup([784 100 10]);opts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samples[nn, L] = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.08, &#39;Too big error&#39;);%% ex2 neural net with L2 weight decayrand(&#39;state&#39;,0)nn = nnsetup([784 100 10]);nn.weightPenaltyL2 = 1e-4; % L2 weight decayopts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samplesnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, &#39;Too big error&#39;);%% ex3 neural net with dropoutrand(&#39;state&#39;,0)nn = nnsetup([784 100 10]);nn.dropoutFraction = 0.5; % Dropout fraction opts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samplesnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, &#39;Too big error&#39;);%% ex4 neural net with sigmoid activation functionrand(&#39;state&#39;,0)nn = nnsetup([784 100 10]);nn.activation_function = &#39;sigm&#39;; % Sigmoid activation functionnn.learningRate = 1; % Sigm require a lower learning rateopts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samplesnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, &#39;Too big error&#39;);%% ex5 plotting functionalityrand(&#39;state&#39;,0)nn = nnsetup([784 20 10]);opts.numepochs = 5; % Number of full sweeps through datann.output = &#39;softmax&#39;; % use softmax outputopts.batchsize = 1000; % Take a mean gradient step over this many samplesopts.plot = 1; % enable plottingnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, &#39;Too big error&#39;);%% ex6 neural net with sigmoid activation and plotting of validation and training error% split training data into training and validation datavx = train_x(1:10000,:);tx = train_x(10001:end,:);vy = train_y(1:10000,:);ty = train_y(10001:end,:);rand(&#39;state&#39;,0)nn = nnsetup([784 20 10]); nn.output = &#39;softmax&#39;; % use softmax outputopts.numepochs = 5; % Number of full sweeps through dataopts.batchsize = 1000; % Take a mean gradient step over this many samplesopts.plot = 1; % enable plottingnn = nntrain(nn, tx, ty, opts, vx, vy); % nntrain takes validation set as last two arguments (optionally)[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, &#39;Too big error&#39;);```[![Bitdeli Badge](https://d2weczhvl823v0.cloudfront.net/rasmusbergpalm/deeplearntoolbox/trend.png)](https://bitdeli.com/free "Bitdeli Badge")

数学建模模型总结

这是本人在两年内准备参加数学建模竞赛搜集到的模型资料,已经经过了本人的筛选和整理,希望能够对准备参加数学建模竞赛的学弟学妹们提供一些帮助!

如何降低前端业务复杂度?

来源:lecepinhttps://juejin.cn/post/7045090471852376101无论做业务需求还是做平台需求的同学,随着需求的不断迭代,通常都会出现逻辑复杂、状态混乱的现象,维护和新增功能的成本也变的十分巨大,苦不堪言。下图用需求、业务代码、测试代码做对比:图中分了 3 个阶段:阶段 1:正常,都是线性增长。阶段 2:需求数正常增长,业务代码行数开...

zz_jesse的博客 907

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

Web前后端:如何分离,如何解耦?

摘要:在本文中我们一起来探讨一下为什么要在软件开发中进行前后端的分离,如何做到前后端分离,如何解耦。 简单地说,就是要把复杂的问题简单化,把一个从0到N的问题转化为N个0到1的问题。另一个相近的说法就是“解耦”。 举个例子,我们接到一个客户需求,要求写一个应用,这个应用中有页面的切换,有对应页面的数据交互,数据的获取,数据的计算,如果把这些功能放在一个单一的应用中的话,从大局观的角度来看,这个单一的应用是比较复杂的。 为了降低这个复杂度,我们首先要做的就是前后端分开,关于前后端的定义,大体来说是这样的

华为云官方博客 5204

efm32 入门.pdf

本PDF共计22页,介绍的是操作驱动API,下载与否自己斟酌。

前端解耦的一个最简单示例

  且看这样一段HTML片段:   &lt;div id="name" style="background-color:red" onclick="alert('');"&gt;Jim&lt;/div&gt;   这是前端代码全部耦合在一起的例子,下面对它进行MVC解耦。   第一步解耦,把View层分离出来:   &lt;div id="name" class=&quo

四火专栏 715

React 组件解耦之道

React 的组件非常的灵活可扩展,不过随着业务复杂度的增加和许多外部工具库的引入,组件往往也会显得浮肿,接下来我们就一起来看看常见的几种,遵循单一职责原则的,组件分割与解耦的方法 分割 render 函数当一个组件渲染的内容较多时,有一个快速并且通用的方法是创建sub-render函数来简化原来庞大的 renderclass Panel extends React.Component { re

枫上雾棋的日志 582

组件化解耦的架构设计思考

组件化 最近几天在整理项目中的要点,组件化相信大家都不陌生,还是复用以前的一张项目架构图,可以看到,项目的架构目前看起来比较清晰了,在最下层沉淀的是我们的公共库,比如网络库,图片库,工具类,......等等 上层的业务,比如短视频模块,分享模块,直播间模块等等,彼此直接并不会相互依赖,但是今天想说的是解耦的问题 一个需求引发的思考 由于公司另外一个项目组需要使用我们的核心功能,比如直播间,短视频...

handy周 3670
上一篇: 干货 | 每天十亿级数据更新,秒出查询结果,ClickHouse在携程酒店的应用
下一篇: 干货 | 揭秘 Vue 3.0 最具潜力的 API
携程技术
博客等级 码龄10年 3716粉丝 324原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值