reamweaver对一个web前端工作者来说，再熟悉不过了，像我07年接触web前端开发就是用的dreamweaver，一直用到现在，身边的朋友有跟我推荐过各种更好用的可替代dreamweaver的工具，一开始我是拒绝的，但是后来我发现竟然真有比dreamweaver好用的工具，智能提示，自动补全工具，模糊编码这些用上手了以后根本停不下来，sublime text当之不愧是最佳替代方案第一选择。

1. Sublime Text

Sublime Text2是一款跨平台的编辑器，再也不用为换平台而找不到合适的、熟悉的编辑器担忧了。

Sublime Text2 是一款具有代码高亮、语法提示、自动完成且反应快速的编辑器软件，不仅具有华丽的界面，还支持插件扩展机制，用她来写代码，绝对是一种享受。

Sublime Text 2 的特色功能：

• 良好的扩展功能，官方称之为安装包(Package)。

• 右边没有滚动条，取而代之的是代码缩略图，这个功能非常赞

• 强大的快捷命令“可以实时搜索到相应的命令、选项、snippet 和 syntex， 按下回车就可以直接执行，减少了查找的麻烦。”

• 即时的文件切换。

• 随心所欲的跳转到任意文件的任意位置。

• 多重选择(Multi-Selection)功能允许在页面中同时存在多个光标。

• 支持 VIM 模式

• 支持宏，简单地说就是把操作录制下来或者自己编写命令，然后播放刚才录制的操作或者命令。

• 更新非常勤快

2. TopStyle5

TopStyle 是一款 CSS 开发辅助工具，即 HTML5 / CSS3 编辑器，它专注于 HTML CSS 设计辅助，提供比较多的功能，如 CSS 代码检查等，据称 TopStyle 的帮助文件非常好，有详细的 CSS 指令，适于初次接触 CSS 的学习之用。

不过如果你想对 CSS 了如指掌，对 CSS 网页布局非常熟练，还是扔掉一切辅助软件，用记事本开发，而熟练 CSS 之后，再使用此类辅助软件，可以提高工作效率和开发速度。

TopStyle 5 在 CSS3 / HTML5 方面的增强：

*??CSS3 for Inspector, Insight and Style Checker

*??Prefixr

*??CSS3 Media Queries

*??CSS Gradient Generator

*??Text Shadow Generator

*??Improved options for Preview Files (CSS-only)

*??HTML5 for Inspector and Insight

*??HTML5-only Validator

*??HTML Structure Panel

*??Wrap HTML Tag

*??Image Map Editor (HTML-only)

3. Chocolat

Chocolat是Mac系统上最新出现的一款强大的文本编辑器，兼具原生的Cocoa及强大的文本编辑功能。Chocolat支持多种编程语言的关键字高亮显示、窗口分割、标签页、色彩主题等功能。界面和MacVim非常相似。

4. Aptana

Aptana 是一个非常强大,开源,专注于JavaScript的Ajax开发IDE。它的特性包括： *JavaScript,JavaScript函数,HTML,CSS语言的Code Assist功能。 *Outliner(大纲)：显示JavaScript,HTML和CSS的代码结构。

*支持JavaScript，HTML，CSS代码提示，包括JavaScript 自定函数

*代码语法错误提示。

*支持Aptana UI自定义和扩展。

*支持跨平台。

*支持FTP/SFTP

*调试JavaScript

*支持流行AJAX框架的Code Assist功能：AFLAX，Dojo，JQuery，MochiKit，Prototype，Rico，script.aculo.us，Yahoo UI，Ext。

*Adobe AIR与iPhone开发工具

5. Komodo IDE

Komodo 是一个跨平台支持多种程序语言的Integrated Development Environment （IDE）软件，目前他支持了在Windows与Linux上 ，Pythone, Ruby, Rails, Perl, HTML, CSS, and JavaScript,等的程序语言开发，以及多种程序语言语法着色。

6. Eclipse

Eclipse是 著名的跨平台的自由集成开发环境（IDE）。最初主要用来Java语言开发，但是目前亦有人通过插件使其作为其他计算机语言比如C++和Python的开 发工具。Eclipse的本身只是一个框架平台，但是众多插件的支持使得Eclipse拥有其他功能相对固定的IDE软件很难具有的灵活性。许多软件开发 商以Eclipse为框架开发自己的IDE。

Eclipse的基础是富客户机平台（Rich Client Platform, 即RCP）。RCP包括下列组件：

• 核心平台(启动Eclipse，运行插件）

• OSGi（标准集束框架）

• SWT（可移植构件工具包）

• JFace（文件缓冲，文本处理，文本编辑器）

• Eclipse工作台（即Workbench ，包含视图（views）、编辑器（editors）、视角（perspectives）、和向导（wizards））

Eclipse采用的技术是IBM公司开发的（SWT），这是一种基于Java的窗口组件，类似Java本身提供的AWT和Swing窗口组件；不 过IBM声称SWT比其他Java窗口组件更有效率。Eclipse的用户界面还使用了GUI中间层JFace，从而简化了基于SWT的应用程序的构建。

Eclipse的插件机制是轻型软件组件化架构。在富客户机平台上，Eclipse使用插件来提供所有的附加功能，例如支持Java以外的其他语 言。 已有的分离的插件已经能够支持C/C++（CDT）、Perl、Ruby，Python、telnet和数据库开发。插件架构能够支持将任意的扩展加入到 现有环境中，例如配置管理，而决不仅仅限于支持各种编程语言。

Eclipse的设计思想是：一切皆插件。Eclipse核心很小，其它所有功能都以插件的形式附加于Eclipse核心之上。Eclipse基本内核包括：图形API (SWT/Jface)， Java开发环境插件(JDT )，插件开发环境(PDE)等。

Eclipse由各种不同的计划组成。以下列出了部分计划。

• Eclipse计划：本身包括Eclipse平台，Eclipse富客户端平台（RCP）和Java开发工具（JDT）。

• Eclipse测试和性能工具平台（TPTP）：提供一个允许软件开发者构建诸如测试调试、概况分析、基准评测等测试和性能工具的平台。

• Eclipse Web工具平台计划 （WTP）：用Java企业版Web应用程序开发工具来扩展Eclipse平台。它由以下部分组成：HTML、JavaScript、CSS、JSP、SQL、XML、DTD、XSD和 WSDL的 源代码编辑器；XSD和WSDL的图形界面编辑器；Java企业版的“项目性质”（project nature）、建构器（builder）和模型（model），与一个Java企业版的导航（navigator）；一个Web服务（Web service）向导和浏览器，还有一个WS-I测试工具；最后是数据库访问查询的工具与模型。

• Eclipse商业智能和报表工具计划（BIRT）：提供Web应用程序（特别是基于Java企业版的）的报表开发工具。

• Eclipse可视化界面编辑器计划（VEP）：一个Eclipse下创建图形用户界面代码生成器的框架。

• Eclipse建模框架（EMF）：依据使用XMI描述的建模规格，生成结构化数据模型的工具和其他应用程序的代码。

• 图形化编辑器框架（GEF）：能让开发者采用一个现成的应用程序模型来轻松地创建富图形化编辑器。

• UML2：Eclipse平台下的一个UML 2.0元模型的实现，用以支持建模工具的开发。

• AspectJ：一种针对Java的面向侧面语言扩展。

• Eclipse通讯框架（ECF）：专注于在Eclipse平台上创建通讯应用程序的工作。

• Eclipse数据工具平台计划（DTP）

• Eclipse设备驱动软件开发计划（DSDP）

• C/C++开发工具计划（CDT）：努力为Eclipse平台提供一个全功能C和C++的集成开发环境（IDE），它使用GCC作为编译器。

• Eclipse平台COBOL集成开发环境子计划（COBOL）：将构建一个Eclipse平台上的全功能COBOL集成开发环境。

• 并行工具平台（PTP）：将开发一个对并行计算机架构下的一组工具进行集成的平行工具平台，而且这个平台是可移植的，可伸缩的并基于标准的。

• 嵌入式富客户端平台（eRCP）：计划将Eclipse富客户端平台扩展到嵌入式设备上。这个平台主要是一个富客户端平台（RCP）组件子集的集合。它能让桌面环境下的应用程序模型能够大致同样地能运用在嵌入式设备上。

但是我个人用的其实还是国产的hbuilder，有点像中文版的sublime text，sublime text提供了很多自动补全，提示等插件，而hbuilder则集成了这些，像我这种懒人就更偏向于傻瓜化点的。

----------------------------

切图网（qietu.com）是一家专门从事web前端开发的服务机构，长期致力于提供高品质的psd转html5、响应适配、webapp切图，h5切图等web前端开发服务。

专注web前端开发技术，关注用户体验，加我们公众微信账号：qietuwang（长按复制）

言

以前的项目大多数都是Java程序猿又当爹又当妈，既搞前，又搞后端。

随着时代的发展，渐渐的许多大中小公司开始把前后端的界限分的越来越明确，前端工程师只负责前端的事情，后端工程师只管后端的事情。正所谓术业有专攻，一个人如果什么都会，那么每一样都很难达到精通。

大中型公司需要专业人才，小公司需要全才，但是对于个人职业发展来说，我建议是分开。你要是这辈子就吃 Java 这碗饭，就不要去研究什么 css，js 等等。

把你的精力专注在 Java，JVM 原理，Spring原理，mysql锁，事务，多线程，大并发，分布式架构，微服务，以及相关的项目管理等等，这样你的核心竞争力才会越来越高，正所谓你往生活中投入什么，生活就会反馈给你什么。

曾几何时

我们的Java Web项目都是使用了若干后台框架进行开发，Spring、Spring MVC、MyBatis、Hibernate等等。

而且大多数项目在Java后端都是分了三层，控制层、业务层、持久层。控制层负责接收参数，调用相关业务层，封装数据，以及路由到JSP页面。然后Jsp页面上使用各种标签（jstl/el）表达式将后台的数据展现出来。

我们先看上述这种情况，需求定完了，代码写完了，测试测完了，然后发布：

你需要用maven或者eclipse等工具把你的代码打成一个war包，然后把这个war包发布到你的生产环境下的Web容器里，发布完了之后，你要启动你的Web容器，开始提供服务，这时候你通过配置域名，dns等等相关，你的网站就可以访问了。

那我们来看，你的前后端代码是不是全都在那个war包里？包括你的js，css，图片，各种第三方的库，对吧？

好，下面在浏览器中输入你的网站域名：www.xxx.com，之后发生了什么？

浏览器在通过ip路由到你的服务，在tcp3次握手之后，通过tcp协议开始访问你的Web服务器，你的Web服务器得到请求后，开始提供服务，接收请求，之后通过response返回你的应答给浏览器。

我们先假设你的首页中有100张图片，以及一个单表的查询，此时，用户的看似一次http请求，其实并不是一次，用户在第一次访问的时候，浏览器中不会有缓存，你的100张图片，浏览器要连着请求100次http请求（有人会跟我说http长链短链的问题，不在这里讨论），你的Web服务器接收这些请求，都需要耗费内存去创建socket来玩tcp传输。

重点来了，这样的话，你的Web服务器的压力会非常大，因为页面中的所有请求都是只请求到你这台服务器上，如果1个人还好，如果10000个人并发访问呢（先不聊web服务器集群，这里就说是单实例Web服务器），那你的服务器能扛住多少个tcp链接？你的服务器的内存有多大？你能抗住多少IO？你给web服务器分的内存有多大？会不会宕机？

这就是为什么，越是大中型的Web应用，他们越是要解耦。

理论上你可以把你的数据库+应用服务+消息队列+缓存+用户上传的文件+日志+等等都扔在一台主机上，但是这样就好像是你把鸡蛋都放在一个篮子里，隐患非常大。

正常的分布式架构，是都要拆开的，你的应用服务器集群（前，后）+文件服务器集群+数据库服务器集群+消息队列集群+缓存集群等等。

步入正题

下面步入正题，首先以后的 Java web项目都尽量要避免使用JSP，要搞前后台解耦，玩分布式架构，这样我们的应用架构才更强。

使用 JSP 的痛点：

1. 动态资源和静态资源全部耦合在一起，无法做到真正的动静分离。服务器压力大，因为服务器会收到各种http请求，例如css的http请求、js的、图片的、动态代码的等等。一旦服务器出现状况，前后台一起玩完，用户体验极差。

2. 前端工程师做好html后，需要由Java工程师来将html修改成jsp页面，出错率较高（因为页面中经常会出现大量的js代码），修改问题时需要双方协同开发，效率低下。

3. JSP 必须要在支持Sava的Web服务器里运行（例如tomcat等），无法使用nginx等（nginx据说单实例http并发高达5w，这个优势要用上），性能提不上来。

4. 第一次请JSP，必须要在web服务器中编译成servlet，第一次运行会较慢。

5. 每次请求JSP都是访问Servlet再用输出流输出的html页面，效率没有直接使用html高。

6. JSP 内有较多标签和表达式，前端工程师在修改页面时会捉襟见肘，遇到很多痛点。

7. 如果JSP中的内容很多，页面响应会很慢，因为是同步加载。

基于上述的一些痛点，我们应该把整个项目的开发权重往前移，实现前后端真正的解耦！

老的方式：

1. 客户端请求

2. 服务端的servlet或controller接收请求（路由规则由后端制定，整个项目开发的权重大部分在后端）

3. 调用service,dao代码完成业务逻辑

4. 返回JSP

5. jsp展现一些动态的代码

新的方式：

1. 浏览器发送请求

2. 直接到达html页面（路由规则由前端制定，整个项目开发的权重前移）

3. html页面负责调用服务端接口产生数据（通过ajax等等）

4. 填充html，展现动态效果。

有兴趣的童鞋可以访问一下阿里巴巴等大型网站，然后按一下F12，监控一下你刷新一次页面，他的http是怎么玩的，大多数都是单独请求后台数据，使用 json传输数据，而不是一个大而全的http请求把整个页面包括动+静全部返回过来

这样做的好处是：

1. 可以实现真正的前后端解耦，前端服务器使用nginx。

前端服务器放的是css，js，图片等等一系列静态资源。甚至你还可以css，js，图片等资源放到特定的文件服务器，例如阿里云的oss，并使用cdn加速，前端服务器负责控制页面引用，跳转，调用后端的接口，后端服务器使用tomcat。

这里需要使用一些前端工程化的框架比如nodejs，react，router，react，redux，webpack

2. 发现bug，可以快速定位是谁的问题，不会出现互相踢皮球的现象。

页面逻辑，跳转错误，浏览器兼容性问题，脚本错误，页面样式等问题，全部由前端工程师来负责。

接口数据出错，数据没有提交成功，应答超时等问题，全部由后端工程师来解决。

双方互不干扰，前端与后端是相亲相爱的一家人。

3. 在大并发情况下，我可以同时水平扩展前后端服务器，比如淘宝的一个首页就需要2000台前端服务器做集群来抗住日均多少亿+的日均pv。

去参加阿里的技术峰会，听他们说他们的web容器都是自己写的，就算他单实例抗10万http并发，2000台是2亿http并发，并且他们还可以根据预知洪峰来无限拓展，很恐怖，就一个首页。

4. 减少后端服务器的并发压力，除了接口以外的其他所有http请求全部转移到前端nginx上。

5. 即使后端服务暂时超时或者宕机了，前端页面也会正常访问，只不过数据刷不出来而已。

6. 也许你也需要有微信相关的轻应用，那样你的接口完全可以共用，如果也有app相关的服务，那么只要通过一些代码重构，也可以大量复用接口，提升效率。

7. 页面显示的东西再多也不怕，因为是异步加载。

注意：

1. 在开需求会议的时候，前后端工程师必须全部参加，并且需要制定好接口文档，后端工程师要写好测试用例，不要让前端工程师充当你的组专职测试，推荐使用

chrome的插件postman，service层的测试用例拿junit写。

2. 上述的接口并不是java里的interface，说白了调用接口就是调用你controler里的方法。

3. 加重了前端团队的工作量，减轻了后端团队的工作量，提高了性能和可扩展性。

4. 我们需要一些前端的框架来解决类似于页面嵌套，分页，页面跳转控制等功能。（上面提到的那些前端框架）。

5. 如果你的项目很小，或者是一个单纯的内网项目，那你大可放心，不用任何架构而言，但是如果你的项目是外网项目，呵呵哒。

6. 以前还有人在使用类似于velocity/freemarker等模板框架来生成静态页面，现在这种做法也被淘汰掉了。

7. 这篇文章主要的目的是说JSP在大型外网Java web项目中被淘汰掉，可没说JSP可以完全不学，对于一些学生朋友来说，servlet等相关的Java web基础还是要掌握牢的，不然你以为Spring MVC这种框架是基于什么来写的？

我是一个从事IT行业十多年的技术热爱者，如果大家对于学习Java有任何问题。比如如何提升技术、学习方法应该注意什么、以及如何才能提升薪资或者缺少比较新的Java学习资料，都可以随时来咨询我，私信我“Java”会自动回复我的交流方式以及全面的Java系统学习教程，希望大家可以多交流，找到属于自己的圈子。