原文地址:Bootstrap considered harmful

原文作者:Hidde de Vries

译文出自:neal

译者: Neal

个人主页:http://neal1991.pythonanywhere.com

这些年Bootstrap已经在前端项目中流行起来,它能够带来很多好处。然而,但是如果以你们的团队已经有了在职的前端开发人员,我觉得最好还是不要用Bootstrap,在某些地方,弊大于利。

Bootstrap的好处是什么

Bootstrap主要是栅格系统,但同时也带来了很多组件的样式表和脚本,包括表格,导航栏,进度条,页码,表单样式,模式和提示文本。在这篇文章,我所说的Bootstrap是包含它的所有功能的。

Bootstrap是一个很好的工具对于一个纸箱装饰他们的程序但是无须担心结果的样式问题的后端开发人员。如果因为某些原因,预算或者什么的,你的团队没有前端开发人员或者设计人员,Bootstrap是一个绝佳的弥补方法。

对于设计人员来说,Bootstrap也是有用处的:它可以快速地从设计软件切换到浏览器中,不需要过多担心前端的代码设计。

即使是对于那些基本只专注于数据但是很少关注UI和布局的前端开发人员来说,Bootstrap也是一个绝佳的工具。

什么时候你最好别用它

然而,如果你的团队已经拥有了前端开发人员,使用Bootstrap可能会潜在的浪费他们宝贵的时间,并让他们可能从解决实际问题上转移注意力。Bootstrap做的正是前端开发人员所擅长的事情,但是用的是一种很通用的方式。你的网站或者网络app是非常特别的,因此如果你使用一个通用的系统可能会不太合适。这意味着为了实现这种特殊性将会包含很多的异常发生。

当需要很多异常来复位Bootstrap

Bootstrap曾经是被Twitter 的开发人员用于系统化他们网络app的样式。如果你的网站app和他们的样式不一样,这意味着你需要解除他们中的某些样式。

很多网站和Twitter的样式并不相同。因此,如果他们装载了Bootstrap的时候,他们可能需要卸载很多地方。

在某些网站上,我看到有9/10的Bootstrap样式已经被网站自己的样式所替代。坦白说,这很荒谬。

当它让简单的事情变得复杂

CSS是给网站添加一套简单的样式规则,这有时候可能会被重写。当你在你的网站使用Bootstrap的样式的时候,几乎所有的元素都是用一个复杂的样式规则。任何异常都会在它之上表现。问题是大多数网站他们的样式异常都被表现在Bootstrap之上。

Bootstrap的样式是非常复杂的:你可以利用12列的栅格系统和任何元素相结合起来,对于需要特别处理的列则要区别对待。很多网站十分简单:它们在小屏幕设备上没有列或者只有一到两列在大一点的屏幕上。

当它产生技术债务的时候

前端依赖Bootstrap的时间越长,就会牵扯到更多的东西,更多的规则需要设置来覆盖Bootstrap的某些规则。这或多或少地让技术代码背负技术债务,尤其前端代码的部署需要手动的更新。随着依赖的增多,Bootstrap将变得更加难以移除。

当它命名一些不是你app的规定

命名是一件很困难的事情,为团队的应用中的规定命名需要花费相当多的时间。使用’btn’之类的缩写并不能很好的给组件命名。

结论

Bootstrap可能对于产生网站的多个流程都起到了很大的帮助。但是它并不能让所有的事情都变得简单:相反,很多问题可以由前端开发人元专注于UI就能够更好地解决。

Bootstrap真的总是好的吗的更多相关文章

  1. 如何使用bootstrap

    前言: 前几天,本想做一个登陆界面,但自己写form表单必然很丑,所以想用下bootstarp框架,之前听别人说bootstrap很牛的样子.但我完全不会bootstrap... 下载&目录 ...

  2. Bootstrap--常用及实例合集

    栅格系统 1. row必须放到container和container-fluid里面        2. 你的内容应当放置于“列(column)”内,并且,只有“列(column)”可以作为行(row ...

  3. 我眼中的如何成为一名合格的PHP高级开发工程师

    转眼间搞PHP已超过10年准确的说12年,混在帝都,也经历过大公司小公司,有个同行朋友问我,我就思考下,如何成为一名合格的PHP高级开发 所有的所有仅限综合知识,因为PHP其实内容也很多,有的人专门研 ...

  4. bootstrap和elementUI真的会冲突

    前两天,做了一个支持markdown的功能: http://www.cnblogs.com/XHappyness/p/8097756.html 后面发现预览效果某些标签需要bootstrap的支持才能 ...

  5. 分页插件--根据Bootstrap Paginator改写的js插件

    刚刚出来实习,之前实习的公司有一个分页插件,和后端的数据字典约定好了的,基本上是看不到内部是怎么实现的,新公司是做WPF的,好像对于ASP.NET的东西不多,导师扔了一个小系统给我和另一个同事,指了两 ...

  6. Bootstrap 4-alpha 初体验

    What is Bootstrap? 第一句话就是废话了,作为新时代有理想有节操的开发人员无人不知无人不晓.可能就是熟悉程度因为各种原因不尽相同,有人只是知道他大概是个什么东西,有些人可能基本可以使用 ...

  7. JS组件系列——Bootstrap Table 表格行拖拽(二:多行拖拽)

    前言:前天刚写了篇JS组件系列——Bootstrap Table 表格行拖拽,今天接到新的需要,需要在之前表格行拖拽的基础上能够同时拖拽选中的多行.博主用了半天时间研究了下,效果是出来了,但是感觉不尽 ...

  8. 如何更高效地定制你的bootstrap

    bootstrap已经作为前端开发必不可少的框架之一,应用bootstrap使得我们对布局.样式的设定变得非常简单.但bootstrap提供的默认样式往往不能满足我们的需求,从而定制化bootstra ...

  9. web前端程序员真的值这么多钱吗?

    对于互联网公司来说用户就是上帝,做好客户体验一切才有可能.所以互联网公司都会把钱砸向前端,Web前端程序员也越来越受到企业争相聘用. 前端工程师工资也越来越高,目前Web前端工程师工作1~2年后通常会 ...

随机推荐

  1. 内核热patch

    如下代码是一个内核patch #include <linux/init.h> #include <linux/module.h> #include <linux/modu ...

  2. Oracle的优化

    Oracle优化:物理优化和逻辑优化.物理优化:1):Oracle的运行环境.2):合理的使用优化器.3):合理配置Oracle实例参数4):建立合适的索引(减少IO)5):将索引数据和表数据分开在不 ...

  3. mybatis时间范围查询

    <if test="excStartTime!=null and excStartTime!=''"> <![CDATA[ and DATE_FORMAT(dl. ...

  4. 01 Netty是什么?

    01 Netty是什么? IO编程 我们简化下场景:客户端每隔两秒发送一个带有时间戳的 "hello world" 给服务端,服务端收到之后打印. 为了方便演示,下面例子中,服务端 ...

  5. js返回上一页并刷新的几种方法

    1.返回上一页 1)<a href="javascript:history.go(-1)"></a> 2)<a href="javascri ...

  6. #1122 JSP动作元素

    JSP动作元素 与JSP指令元素不同的是,JSP动作元素在请求处理阶段起作用.JSP动作元素是用XML语法写成的. 利用JSP动作可以动态地插入文件.重用JavaBean组件.把用户重定向到另外的页面 ...

  7. No plugin found for prefix 'war' in the current project and in the plugin groups

    解决办法: 在pom里面添加 : <dependency> <groupId>org.apache.maven.plugins</groupId> <arti ...

  8. O(1)得到螺旋矩阵的值

    LL ind(LL x, LL y, LL n){ LL qs = n / , q = min(n - y + , min(n - x + , min(x, y))) - ; && y ...

  9. K-th occurrence HDU - 6704 (后缀数组+二分线段树+主席树)

    大意: 给定串s, q个询问(l,r,k), 求子串s[l,r]的第kk次出现位置. 这是一篇很好的题解: https://blog.csdn.net/sdauguanweihong/article/ ...

  10. linux shell的一些配置

    alias egrep='egrep --color=auto'alias fgrep='fgrep --color=auto'alias grep='grep --color=auto'alias ...