Question

我的情况是根据@page_name变量呈现不同的背景图像。在我看来，我可以在HTML中做这样的事情：

<div class="jumbotron" style="background-image: url(<%= asset_path "Jumbotron/#{@page_name}.gif" %>)">

哪个是DRYest，或者我实际上可以使用CSS文件并执行以下操作：

<div class="jumbotron <%= @page_name %>">

.jumbotron.home {
  background-image: url(<%= asset_path "Jumbotron/home.gif" %>);
}

.jumbotron.outdoors {
  background-image: url(<%= asset_path "Jumbotron/outdoors.gif" %>);
}

.jumbotron.snowsports {
  background-image: url(<%= asset_path "Jumbotron/snowsports.gif" %>);
}

哪会分散问题，但减少DRY。

对什么更优化的想法？例如，从速度和速度绩效观点？

Answer 1

我认为这里没有真正的性能差异。在您的DOM中使用style属性有几个原因 - 每个SEO分析工具都会引发警告标志并阻止您。

我只是去找Principle Of Least Astonishment这里，并在CSS中处理它自然属于的样式。

只有根据路径名称很多这些图片，或者用户输入时，我才会选择第一个选项。

但这只是我的意见。

DRY与适当的关注点分离

1 个答案: