如何组织模块化Web应用程序

Question

我有一个网站，在典型的“仪表板”页面上有多个模块。所有这些都与同一个数据库和同一组表进行通信，其中一些表完成了写作，一些显示等工作。

我应该使用iframe来实现或组合所有代码还是有其他选择？

这些模块可以在客户端javascript级别上相互交互。例如，我单击模块A中的按钮，模块B中的文本框将被隐藏。

此外，您如何实现这一点，当我使用模块A将数据写入数据库时​​，模块B将知道是时候再次获取新数据。

Answer 1

  

我应该使用iframe来实现或组合所有代码还是有其他选择？

更好：模板驱动的网站

  

此外，您如何实现这一点，当我使用模块A将数据写入数据库时​​，模块B将知道是时候再次获取新数据。

有很多方法，例如：

1. 添加bool列'flag'，以标记是否已更改行（如果是，则假定为1） 修改，否则为0）
2. 模块B在给定的时间间隔内查询服务器（你正在使用AJAX，对吧？）来检查 那些'标志'，检索它们并设置为0，然后根据需要重新显示它们

Answer 2

如果网页的不同位需要相互沟通，那么我认为iframe不是一个好主意。 （虽然我可能会遗漏一些东西。）

您可能需要查看Backbone.js。它为您提供了JavaScript中的模型/视图框架，在模型更改时自动重新呈现视图，这可以使您更轻松地保持所有模块彼此同步。

您基本上在页面加载时在Backbone.js模型中复制数据库对象，然后让您的页面模块与其Backbone.js模型保持同步，而不是反复轮询服务器以查找已发生的更改无论如何都在页面中。

Answer 3

没有任何理由可以将iframe用于您所描述的内容。像jQuery这样的Javascript UI库可以避免操作网页的不同元素，同时保持标记更清晰，所以你应该先检查一下。

如果仍然无法解决您在不同模块之间进行通信的问题，请查看Backbone.js：它是一个Javascript模型/视图/控制器库，可帮助您解耦模型（在您的情况下，您的数据库代码） ）以及向其发送数据和/或响应其更新事件（您的仪表板小部件）的视图。