首页 > web前端 > js教程 > 正文

JavaScript 正在杀死网络浏览器

Patricia Arquette
发布: 2024-10-12 06:32:02
原创
382 人浏览过

99% 无 JavaScript 的 Web:可能吗?

JavaScript 是不可预测的、陈旧的,有时会让我呕吐。我不想再用它了。现在,这句话非常适合吸引您的注意力,但同时它也是错误的,因为开发人员不能没有 JavaScript,尤其是前端开发人员。
这次探索是为了寻找避免 JavaScript 的方法。当我说“避免 JavaScript”时,我并不是建议使用转译为 JavaScript 的东西。我实际上的意思是,我只想在应用程序代码的最终输出中使用非常少的 JavaScript。

在 YT 上观看此内容

JavaScript 的过度使用:为什么这是一个问题

当今的开发人员在从前端框架到 API 交互的所有方面都严重依赖 JavaScript。但我们真的需要如此依赖它吗?正在发生的事情是这样的:当有更简单、更高效的替代方案可用时,开发人员常常感到使用 JavaScript 的压力。

采用流行的框架,例如 ReactVueAngularSvelte。这些对于创建动态和响应式网站来说非常棒,但对于更简单的应用程序来说可能有点过头了。它们引入了不必要的复杂性,最终增加了学习曲线并使维护变得令人头痛。

那么,JavaScript 有什么问题呢?

广泛使用会带来几个关键痛点,包括:

  1. 加载时间较慢 – 大型 JavaScript 包会降低页面性能。您添加的每个库都会增加项目的重量,从而导致加载时间变慢。
  2. 客户端渲染问题 – 许多框架不必要地依赖客户端渲染,这可能会导致延迟和性能问题。例如,React 应用程序使用虚拟 DOM 重新渲染整个网页,从而在网页变得可交互之前添加更多时间。
  3. 严重依赖 – 添加的库越多,遇到兼容性、版本更新和依赖冲突的问题就越多。
  4. 隐藏的维护成本 – 跟上不断的更新和过度依赖软件包带来的潜在破坏性变化在时间和资源方面都变得昂贵。

JIT 编译器:天啊!

JavaScript 尝试提高性能的关键领域之一是通过 JIT(即时)编译。现代浏览器,例如 Chrome 的 V8 引擎,会在运行时将 JavaScript 编译为机器代码。

Javascript is Killing Web Browsers

目标是让 JavaScript 尽可能快。

但是,这种优化是有代价的。 JIT 编译器有时会改变 JavaScript 代码的行为,经常引入错误和意外问题,这可能会使您的 Web 应用程序变得脆弱。简而言之,JIT 编译器的优化可能是一场赌博。

常见的 JIT 编译器错误

以下是一些更臭名昭著的错误:

  • 错误编译:如果 JIT 编译器错误优化代码段,它可能会产生不正确的输出。
  • 边界检查消除:在尝试优化时,JIT 编译器可能会跳过必要的检查,例如数组边界,从而为崩溃打开大门。
  • 冗余消除:当 JIT 编译器认为重复的代码是冗余的时,它可能会消除重要的部分,从而导致不可预测的行为。

这些编译器问题强调了广泛测试 JavaScript 以避免意外问题的重要性。但更重要的是,它们展示了为什么我们需要尽可能减少 JavaScript以降低出现新问题的风险。

JavaScript 的客户端替代方案

好消息是您不必陷入 JavaScript 循环中。已经出现了几种替代方案来减少 JavaScript,同时保持功能性。最令人兴奋的两个选项是 HTMXWebAssembly

HTMX:类固醇超媒体

HTMX 允许开发人员使用最少的 JavaScript 构建动态、交互式 Web 应用程序。 HTMX 不再依赖 JavaScript 进行每次交互,而是从服务器发送实际 HTML,从而减少了使用 React 等 JavaScript 框架重新渲染整个 UI 的需要。

想象一下:HTMX 使您能够直接从后端发送 HTML,从而减少客户端流失,而不是发送回 JSON 响应以供前端处理。 HTMX 依靠传统的 HTML 锚点和表单直接调用服务器 - 完全不需要 JavaScript。

Pourquoi HTMX est génial :

  • Courbe d'apprentissage minimale – Ajoutez quelques attributs à votre HTML et vous êtes opérationnel.
  • Fonctionne avec HTML – Évitez de manipuler le DOM en utilisant trop de JavaScript.
  • Remplacement gracieux – Même si quelqu'un désactive JavaScript dans son navigateur, votre application alimentée par HTMX fonctionnera toujours, mais sans certaines cloches et sifflets.

Dans un monde où de nombreuses applications échouent sans JavaScript, HTMX garantit une compatibilité plus large et de meilleures performances. Il revient à l'essentiel, en effectuant des requêtes directement à partir d'éléments HTML, en abordant les composants interactifs comme les formulaires ou les éléments cliquables sans surcharger votre application avec des scripts.

WebAssembly : une centrale de performances

En ce qui concerne WebAssembly (Wasm), l'intention n'est pas de remplacer entièrement JavaScript, mais de gérer des tâches lourdes en termes de calcul. Il peut s'agir de performances de jeu, de calculs de science des données ou de traitement d'images, où JavaScript ne suffit pas du point de vue des performances.

Avec WebAssembly, vous pouvez compiler des langages comme C, C et Rust pour effectuer des tâches spécifiques et lourdes de calcul côté client sans utiliser JavaScript. Cela rend WebAssembly idéal pour des tâches telles que le montage vidéo, les jeux ou le traitement de données, le tout dans un navigateur Web.

Principaux avantages de WebAssembly :

  • Très performant : optimisé pour les tâches gourmandes en CPU avec lesquelles JavaScript a du mal.
  • S'exécute directement dans le navigateur : comme JavaScript, il bénéficie de la prise en charge du navigateur mais ne nécessite pas d'inefficacité d'analyse/de rendu JavaScript.
  • Portable : le même code peut être compilé et exécuté sur tous les navigateurs avec une efficacité exceptionnelle.

Pour tout site nécessitant de gérer beaucoup de calculs, WebAssembly peut accélérer les choses et réduire les temps de chargement.

Côté serveur : il est temps d'abandonner JavaScript ?

Alors que JavaScript était autrefois confiné au côté client, l'introduction de Node.js l'a également rendu extrêmement populaire sur les serveurs. Node a de nombreux atouts : gestion des événements asynchrones, E/S non bloquantes et, bien sûr, utilisation d'un seul langage dans la pile. Mais les pièges de JavaScript (typage dynamique, risques de sécurité tels que la pollution des prototypes et complexité accrue) persistent.

Heureusement, nous avons des alternatives à 100 % à JavaScript côté serveur. En voici quelques-uns :

1. Allez (Golang)

Les goroutines légères de Go permettent des systèmes hautement simultanés et évolutifs sans la surcharge de mémoire des threads. Ce langage est particulièrement adapté aux applications qui nécessitent des performances ultra-rapides avec un trafic à grande échelle.

2. Django (Python)

Django est un favori en matière de sécurité. Il réduit les vulnérabilités telles que la pollution des prototypes et les attaques redos (auxquelles JavaScript est sujette). Même s'il n'est peut-être pas évolutif comme Go, Django est parfait pour les applications plus petites ou soucieuses de la sécurité.

3. PHP (Laravel)

PHP a toujours été un langage backend fiable, et son framework moderne, Laravel, rend les projets de petite et moyenne taille faciles à gérer. Avec un routage automatique et un formidable écosystème de plugins, PHP a toujours sa place dans le monde du développement, malgré l'essor de JavaScript.

4. Rubis sur Rails

Pour un développement rapide, Ruby on Rails offre un environnement élégant et convivial pour les développeurs. Même s'il n'est peut-être pas le meilleur pour gérer des applications à grande échelle, il est parfait pour les petites équipes cherchant des solutions rapides et évolutives.

Les coûts cachés des frameworks JavaScript

Utiliser plus JavaScript, en particulier pour tout ce qui concerne tant le côté client que le côté serveur, entraîne un certain nombre de coûts cachés. Plus votre bundle JavaScript est volumineux, plus vous rencontrerez de problèmes. Voici à quoi vous êtes confronté :

  • 包膨胀 – 添加的库和依赖项越多,最终输出就越会因不必要的代码而膨胀。
  • 增加维护 – 使这些依赖项保持最新会产生维护开销,并且在库进行重大更新时可能会破坏您的应用程序。
  • 重大更改 – 框架更新(甚至小型库更新)可能会破坏现有功能,让您不得不重写大部分代码。

解决方案?优先考虑性能和安全性

最终,减少 JavaScript 不仅仅是为了避免错误或缓慢的加载时间,而是为了构建更快、更简单、更安全的 Web 应用程序。通过将繁重的计算卸载到 WebAssembly,使用 HTMX 本地处理 UI 更新,并将后端逻辑移至 GoPython 等更安全的语言,您将极大地改进您的网络项目。

虽然完全消除 JavaScript 可能并不适合每个人,但尽可能减少 JavaScript 绝对值得追求。这一切都是为了使用现代替代方案来避免将 JavaScript 变成开发人员的瓶颈。

结论

无论您的目标是最小化客户端还是服务器上的 JavaScript,您都可以使您的 Web 应用程序更精简、更快、更安全。 HTMX 和 WebAssembly 为 JavaScript 密集型前端开发提供了令人兴奋的替代方案,而 Go、Django 和 Laravel 是后端的可行选择。

JavaScript 会继续存在,但我们不需要一切都依赖它。通过战略性地减少 JavaScript 的占用空间,我们最终可以构建性能更好且无缝扩展的应用程序。

准备好减少 JavaScript 并控制您的网络应用程序了吗?今天就开始尝试吧!

以上是JavaScript 正在杀死网络浏览器的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:dev.to
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板