对 Web 开发人员来说最有用的 7 个 JavaScript 工具

如果您通过此页面上的链接订阅服务,Reeves and Sons Limited 可能会赚取佣金。 查看我们的 伦理声明.

Many developers try to avoid getting their hands dirty with JavaScript as much as they can avoid it. There is a perception that JavaScript is untidy and encourages bad coding habits, because it doesn’t enforce rules as strictly as most other coding languages.

Yet this is also a strength. It makes developing things in JavaScript quick and easy, provided you know what you are doing. Developing code in JavaScript is often a more efficient process simply because you don’t have to spend as much time debugging, and you can see the results of any changes you make instantly.

If there’s a downside, it’s that some coders actually are lazy, and don’t test their code sufficiently before releasing it, which is why we see so many web pages that consume memory and CPU cycles to excess.

Fortunately one of the very best things about JavaScript is there are so many pre-existing tools that you can make use of. You don’t have to reinvent the wheel on every project. Some of these may even spare you the ordeal of doing any coding at all.

In this article, we’ll take a look at some of the most useful JavaScript tools and libraries available for you to use when you are working on your own projects. In the majority of cases, these tools are free or low cost, and we only selected those that don’t require a lot of effort to learn.

1。 Tota11y

任何Web开发人员最重要的任务之一是确保他们的页面具有良好的可访问性。 实现完美可能很困难,但我们至少应尽量使可访问性因素尽可能好。

Tota11y JavaScript tool from Khan Academy does a very impressive job of analyzing your web pages for accessibility while you’re in the development phase, so you can provide real-time analysis of accessibility factors to your development team.

2。 BrowserSync

入门 BrowserSync 一点也不直接,但一旦你学会了如何使用它,你会发现它在测试实验室中是不可或缺的。 同时在多个浏览器和设备上测试您的网站。

此工具的另一个有趣功能是它可以让您限制连接,这样您就可以模拟在比实际连接速度慢的连接上加载页面。

There are other tools for testing on multiple browsers, but this is the only one we’ve found that also mirrors all your interactions with the page instantly across all your connected browsers and devices.

3。 chart.js之

图表有很多方法可以使用,而且最容易配置的最优雅的免费解决方案之一必须是非常简单的命名 chart.js之 工具。

使用一个非常简单的脚本,您可以创建各种各样的图表,甚至可以将它与数据库结合起来动态加载数据,并在数据发生变化时生成新的图表。 您可以将不同的图表类型混合在一起,这样做是有意义的(例如,组合线和条形图)。

It works by using the HTML5 canvas, and you can create multiple canvases on the page to host multiple charts. Just make sure you give each canvas and chart a unique name so you don’t send data to the wrong target.

Chart.js 的另一个很酷的特性是它生成的图表完全 responsive, so they’ll have a consistent look across a range of different screen sizes.

4。 SamsaraJS

The unusual name choice for this tool (“samsara” in Buddhist tradition refers to the eternal cycle of suffering from which one is supposed to break free) may be an indication of how much work you’ll have to put in to master it, but it is capable of making your web page do amazing things.

The concept here is “layout animation”, and it’s extremely versatile. SamsaraJS 使您可以完全控制布局,从而可以根据预定顺序或响应用户交互来“移动”和更改布局。

5。 Kartograph

如果您的网页将以图形形式显示地理数据,那么 Kartograph 是您为此目的所需的完美JavaScript工具。

任何数据都可以使用引脚点精度建模,并与地图上的特定位置相关联,并在实时SVG图形中生成所有内容。 这意味着甚至可以制作动画。

The best thing about this is how professional the end result looks. It’s certainly an interesting alternative to using more popular mapping solutions such as GoogleMaps, and doesn’t come with any unwanted extras.

使Kartograph脱颖而出的另一个原因是它具有Python和JavaScript的脚本。

6。 拉斐尔

This is an SVG engine that simplifies the task of drawing real-time SVG graphics (this is different from pre-complied SVG graphics). There are numerous advantages to drawing your vector graphics as they’re needed instead of using pre-compiled graphics.

这是技术高级Web应用程序项目,如Kartograph(见上文)和 MCDU仿真器 建成了。

虽然 拉斐尔 库目前尚未处于主动开发阶段,它已经拥有了创建所需内容所需的一切,毫无疑问,它使SVG编码比使用常规SVG语法更容易。

7。 Knockout.js

It’s not easy being a UI framework these days with so much competition around, but Knockout.js has something a little extra special. The learning curve has been flattened out with interactive tutorials. Beyond that, it’s a powerful and flexible framework compacted down to under 60KB in size.

Despite it’s small size, it gives you a lot of control over your DOM elements and lets you build fully interactive responsive 网站快速轻松。

JavaScript isn’t bad

Much of the scorn that has been directed at JavaScript is a legacy from its earliest days, when it definitely wasn’t perfect, and unfortunately decided to incorrectly marry its name forever with Java.

Get to grips properly with JavaScript and you will discover it is a robust object oriented language that is ideal for developing online and offline applications very easily. This isn’t something that can be said about most languages out there.

甚至Java也需要更多的努力,即使它为您提供了许多预定义的跨平台工具。

The tools listed above are just seven very useful ones out of a palette of millions you could choose from. It’s certainly a language that is useful to know, and may well be the best language to master, since it provides the most opportunities.

标题图片由...提供

波格丹兰萨

Bogdan是Inspired Mag的创始成员,在此期间积累了近6年的经验。 在业余时间,他喜欢学习古典音乐和探索视觉艺术。 他也非常着迷于修复工具。 他已拥有5。

评论 0回应

发表评论

您的电邮地址不会被公开。 必填带 *

评分 *

本网站使用Akismet来减少垃圾邮件。 了解您的数据如何处理.