使用JavaScript渲染整个页面是一个好习惯吗?

时间:2016-11-04 16:21:22

标签: javascript json

我搜索了一会儿,发现没有任何相关内容。我甚至尝试过在UX部分询问,他们说它在这里属于更多,所以我们再去一次:

我正在编写一个页面,员工可以编辑,添加,删除或查看库存产品。它(严重)依赖于JavaScript来呈现和动画页面上的一些元素,以加速页面加载过程并改善用户体验,因为服务器只发送纯JSON,然后浏览器JavaScript处理JSON然后呈现(构建) )整页。

它看起来很漂亮,加载速度非常快,但它被认为是一个很好的编程习惯?当它成为一个问题?即使是Internet Explorer或移动浏览器(Chrome,ABP浏览器)也可以毫无问题地显示每个页面。没有打嗝或其他事情。但是当我看到700多条JS线时,问题仍然存在......

如果有人好奇页面看起来像什么,那么这里有一些图片:(可能不相关,可能不是)

https://i.stack.imgur.com/0rLI6.jpg

https://i.stack.imgur.com/d90n9.jpg

4 个答案:

答案 0 :(得分:2)

即可。如果有一个网站可以在没有JavaScript的情况下提供给用户的任何有价值的东西,那么如果你没有这样做,那么你做一件严重的伤害。您的代码可能(读取:)有错误,CDN可能会崩溃,甚至可能因各种原因关闭JS。并且完全可以在没有任何JavaScript(使用表单)的情况下记录用户,并且完全可以在没有JavaScript的情况下获取和提供内容(使用服务器端HTTP请求和呈现)。您已将应用程序结构化为 require JS,但除了数据刷新外,其他任何内容似乎都需要JavaScript。除非你有什么关系,否则你不会告诉我们。

良好的做法不是。在这个具体案例中可辩护吗?可能。

请注意,许多辅助技术现在都是支持JavaScript的,至少google也是如此,即使从SEO角度来看这并不理想,也不会丢失。这真的归结为用户体验。

我并没有采取强硬立场。有明显的反例和存在证明需要JavaScript的东西:画布游戏,文本/图像/等编辑器,吉他调音器,谷歌地图应用程序等。我构建的大多数网站都需要JavaScript。对于内部网站,仅适用于您自己的员工?要求JavaScript可能很好。但对于任何面向公众的事情都要非常非常犹豫。

答案 1 :(得分:0)

理论上没有任何问题。这就是React应用程序通常的工作方式。

SEO重要吗?如果是这样,您将需要考虑一个同构应用程序 - 这意味着您在服务器上生成HTML输出(使用与您在客户端上使用的几乎相同的代码)并将其发送到浏览器。

但是,如果您只是使用JS来呈现没有像React这样的库的HTML内容,我会说这不是一个好主意。 React的流行是它使用虚拟dom。大多数Web应用程序中的第一个性能瓶颈是渲染,或者更具体地说是DOM颠簸。 React做了一些聪明的事情,以最大限度地减少浏览器为了更新页面而需要做的渲染量。

现在,如果有人想构建一个网络应用程序,我很难想到一个很好的理由不将React与Redux一起使用。

答案 2 :(得分:0)

我想注意几件事:

第一个服务器端渲染与客户端。 Javascript非常善于在本地做事....但如果你试图在加载时隐藏元素(仅作为示例),您可能会遇到闪烁或其他奇怪的怪癖,这是一种糟糕的用户体验。具有合适的初始状态非常重要。同样徒劳 - 如果你在javascript中有一个巨大的应用程序,它可能会因为加载时间过长而阻碍用户体验。

第二次可维护性。如果要对不同的UI元素进行组合,则自然会对视图进行更改。这可以说是针对所有软件,但是如果您手动编写没有框架或客户端库(如角度或反应)的组件,那么它将成为您和您正在使用的人的负担。

答案 3 :(得分:0)

根据您提供的信息,它很好(描述的内容为"良好做法"我总是认为其他解决方案并不好,如果不是'案件)。

如果没有选择您的应用程序以查看它是如何设计的,那么潜在的风险

  • 代码版本控制
  • 分离内容和演示文稿
  • 访问控制

代码版本控制

只有来回传递JSON数据意味着您在perofmrnace方面获得了巨大的成功。但是,您是否已计划如何容纳将新版本的Javascript代码部署到客户端?例如使用HTML5清单,交易中的版本信息。

内容和演示文稿的分离

您是否正在发送嵌入在JSON中的序列化HTML,Javascript或CSS?这可能会导致各种并发症和安全问题。

访问控制

如果您的应用遭到入侵,最糟糕的情况是什么?关于保护Web应用程序的通常指导是围绕更常规的带有会话的服务器端HTTP请求 - 响应模型构建的。任何人写安全我们的应用程序的第一件事就是Javascript无法访问会话cookie。 Oauth2专门用于解决这种情况。