`
dazuiba
  • 浏览: 130625 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

页面重构,将重构进行到底!

阅读更多
view中的bad smells:
1 N多的if else,甚至case语句
  这是本文的重点,在最后着重讲(用block替代if else)。
2 直接调用model的find方法
  对策:将find move到controller中,在view中使用controller传来的对象变量

3 对集合进行复杂的操作
  对策:在将这些操作move到helper中,页面调用规整好的数据
  <% items.sort_by{|item|[item.created_on,item.price]}.each do |item| %>
    #so bad
  <% end %>

===>
  <% sorted_item.each do |item| %>
    #so good
  <% end %>

4 临时变量
  将临时变量的代码段 move到helper中
<% rate_box_id = "rate_box_#{item.id}" %>
<% spinner_id = "spinner_#{item.id}" %>
<%= link_to_remote("rate it!",
:url => item_path(item),
:loading => "$('#{spinner_id}').show()",
:complete => "$('#{spinner_id}').hide();$('#{rate_box_id}').highLight();",
) %>
 <%= image_tag('loading.gif', :id => spinner_id)%

==>
<% with_rate_for item do|spinner,spinner_id| %>
  <% link_to_rate(item,:toggle=>spinner_id) %>
  <% spinner %>
<% end %>

=========用block替代if else==============
1 如果集合为空,显示友好的信息
很多时候,如果取到的结果集合为空,需要显示用户另外的信息。当然一般我们会这么写:
  if(@cart.empty)
    您的购物车是空的
  else
    rend :parial=>'cart'
  end

注意,这是在rhtml中写的。这个逻辑还是比较清晰的,但如果一个页面中有几处这种代码,你就得好好考虑一下重构了.
我们可以把集合为空的内容,提到block中,比如:
<%cart_content do%>
  购物车是空的!+N长的rhtml代码
<%end%>
将if else都转移到helper中:
module CartHelper
    def cart_content(&block) 
    return yield if cart_empty? 
    content=(render :partial => "shared/cart" ,:locals  => {:cart => prepare_cart})  
    concat(content,block.binding)
  end
end

2 面对不同的登陆用户,显示不同的内容
 <%header :guest do %> 
     #略
 <%end%>
 <%header :logged_user do %>
   #略
 <%end%>
 <%header :admin  do %> 
   #略
 <%end%>

helper中的方法
	def header(who) 
		yield if logged_in? who
	end

==========================总结================================
    以上代码,都是一些例子,可能不太具有说服力。但在这里要强调的是,view层难测试,自解释差,难重用。在复杂度综合不便的情况下,我更倾向于helper复杂一些,view简单一些。更何况,一些公共的重复代码搬移以后,的确会达到DRY的目的,这是rails设计中是中贯彻的理念。
  
分享到:
评论
3 楼 linzy410 2008-01-10  
这样一来,可能就是help里面太乱了,什么都往里面塞。
2 楼 skzr.org 2007-12-24  
呵呵,真丑陋阿/tx
是啊ruby怎么就能代替java
我还指望着称为java高手呢
1 楼 jarwang 2007-11-30  
精华贴都这样...可想而知.ruby有多"热门"了?
其实就是有点不明白.ruby怎么就能代替java???

相关推荐

    寒假前端实训-小米商城部分页面重构.zip

    寒假前端实训_小米商城部分页面重构.zip寒假前端实训_小米商城部分页面重构.zip寒假前端实训_小米商城部分页面重构.zip寒假前端实训_小米商城部分页面重构.zip寒假前端实训_小米商城部分页面重构.zip寒假前端实训_...

    视频频道页面重构总结1

    视频频道页面重构是软件开发中优化代码结构、提高程序性能的重要步骤。在本文中,我们将探讨一个具体的重构案例,主要集中在Android平台的视频应用上。重构的目的是解决原有代码存在的问题,提升用户体验和开发效率...

    页面重构中的设计模式

    在本文中,我们将详细探讨页面重构过程中的设计模式,以及如何通过这些设计模式来提升代码的可维护性、复用性和灵活性。 首先,页面重构中的设计模式强调的是将内容、结构、表现和行为分离,这一原则不仅有助于提升...

    阳光喔页面重构.zip

    《阳光喔页面重构》 在IT行业中,网页重构是一项至关重要的技能,它涉及到对现有网页结构、样式和功能的优化,以提升用户体验、提高页面加载速度以及更好地适应不同设备的显示。本项目“阳光喔页面重构”提供了一个...

    网站重构,公用模板重构

    在本文中,我们将深入探讨这两个概念,并重点分析公用模板重构的关键要素。 首先,重构是软件开发中的一个过程,它不改变软件的功能,而是通过改进代码结构和设计来提高其可读性、可扩展性和性能。在Web开发领域,...

    div css网页重构

    在本案例中,我们关注的主题是"div css网页重构",这指的是使用HTML中的`&lt;div&gt;`元素结合CSS(层叠样式表)进行页面布局和设计。 `&lt;div&gt;`元素是HTML中的一个通用容器,它没有特定的语义,但可以用于组织文档结构,...

    如何进行重构 pdf

    本文将详细介绍如何进行PDF重构,包括为什么要进行PDF重构、PDF重构的基本步骤以及一些实用技巧。 #### 为什么进行PDF重构? 1. **提升可读性和易用性**:随着设备和屏幕尺寸的变化,原有的PDF文档可能不再适用于...

    html与css网易严选重构页面.zip

    HTML(HyperText Markup Language)和CSS(Cascading Style Sheets)是网页开发的两大核心技术...通过分析和学习这个项目,开发者可以提升自己在网页重构和前端开发方面的技能,理解如何将设计稿转化为实际的交互网页。

    cLayout一键生成重构稿

    这个工具基于JavaScript技术,专注于提高工作效率,通过Canvas技术自动识别并处理页面设计图,从而自动生成静态重构稿。下面将详细介绍这个工具及其相关知识点。 首先,我们需要理解“重构稿”的概念。重构稿,又...

    重构-Ajax 教程

    综上所述,"重构-Ajax 教程"旨在教授如何将Ajax技术应用于网页重构,提高用户体验,同时也涵盖了XHTML和CSS的基础知识。通过学习,开发者可以掌握如何使用Ajax进行异步数据交换,以及如何结合XHTML和CSS优化网页结构...

    前端重构实践(一):性能优化

    本文将讨论如何对前端代码进行性能优化,提高页面加载速度。 常规优化手段: 1. CSS 置顶,JS 置底,以减少页面加载时间。 2. 静态资源外联、合并、压缩,以减少 HTTP 请求次数和文件大小。 3. 图片优化,使用 ...

    WEB标准和网站重构

    而网站重构则是对现有网站进行改进,使其更符合这些标准的过程。以下是关于这两个主题的详细讨论: 1. **Web标准**:Web标准主要由W3C(万维网联盟)制定,包括HTML(超文本标记语言)、CSS(层叠样式表)和...

    单页面海淘商城重构版

    在本次的"单页面海淘商城重构版"项目中,主要目标是对原有的海淘商城进行系统性的优化,提升用户体验和性能。项目包含了16个关键的主体页面,涵盖了用户从注册到完成购买的整个购物过程,包括注册、登录、商品展示、...

    重构HTML改善Web应用的设计pdf

    10. **工具与自动化**:现代Web开发中,有许多工具可以帮助进行HTML重构,如预处理器(如Pug或Haml)、代码质量检查工具(如HTML Lint)和自动化构建工具(如Gulp或Webpack),它们能提高重构效率并确保代码质量。...

    《网站重构:应用Web标准进行设计(第3版)》PDF

    《网站重构:应用Web标准进行设计(第3版)》这本书是Web开发领域的经典之作,主要探讨了如何通过采用Web标准来改进网站的设计与开发流程,以提高网站的可维护性、性能和可访问性。在这一第三版中,作者可能会深入讲解...

    项目重构方案设计.pdf

    - **UI层**:采用MVVM模式,UI结构更加清晰,安全验证首先通过Security模块进行,页面功能的实现通过服务层进行数据交互。 - **Service层**:通过WCF作为服务层,隔离应用,方便扩展和维护,增强系统弹性。 - **...

    重构极限编程XP的实践与反思

    本书作者通过实践和反思,对XP的核心原则和实践进行了批判性的分析,并提出了重构这一概念,以期优化软件开发过程。 首先,重构是改善代码结构而不改变其外在行为的过程,旨在提高软件的可读性和可维护性。书中详细...

Global site tag (gtag.js) - Google Analytics