14 aspects that affect jQuery's use and 14

14 aspects that affect jQuery's use and 14

Fortunately, people usually have different plug-ins to choose from. However, even if you only use one, you need to determine whether it is worth using. Never introduce wrong code in your code library.

Do you need a plug-in?

First, you need to determine whether you need a plug-in. If you do not need it, you can save both the file size and time.

　　1. Is it better to write it by yourself?

If the function is simple, write it by yourself. JQuery plug-ins often bind various functions, which may be overkill. In this case, handwriting of any simple function is often more meaningful. Of course, we need to measure the workload involved.

For example, if you need more advanced functions, jQuery UI's accordion is a good choice. But if you only need to open and close the panel. If you have not used jQuery UI on your website, consider jQuery's slideToggle () or animate ().

　　2. Are you using a similar plug-in?

It is tempting to find another plug-in to make up for it when you find that a plug-in cannot solve everything you need. But the same application contains two similar plug-ins, which must be a bloated JavaScript. Can you find a plug-in that includes all your requirements? If not, can you extend one of the plug-ins to everything you need? Similarly, when deciding whether to expand a plug-in, the benefits and development time are weighed.

For example, the jQuery lightbox is a great way to display the pop-up photos in the gallery. simpleModal is a great way to display the mode information to users. But why are both of these methods used by your website? You can easily extend one coverage requirement. Better, find a plug-in that covers everything, such as Colorbox.

　　3. Need JavaScript?

In some cases, JavaScript is unnecessary. CSS pseudo selector, such as hover and CSS3 transitios, can cover a variety of dynamic effects, and the speed far exceeds the JavaScript solution. In addition, many plug-ins only provide styles; it may feel better to use markup and CSS.

If you need to display dynamic content and require conditional prompts, jQuery Tooltip is essential. However, if you only have a few tips, you 'd better use pure CSS (see this example ). Static prompt information, you can further use CSS3 transition for animation effect, but do not forget that the animation will only work in Some browsers.

When reviewing any plug-in, a series of warning signs indicate that the plug-in is of poor quality. Here, we will look at all aspects of the plug-in, from JavaScript to CSS to mark-up. We may even consider how to release plug-ins. Any warning in the plug-in will exclude your plug-in from consideration. If you are lucky to have multiple plug-ins for selection, these warning regulations can help you narrow down your selection. However, even if you only have one choice, it is better to give up if you see too many warnings. You can reduce your headaches in advance.

　　4. Strange option or parameter syntax

When using jQuery, developers are concerned about how functions accept parameters. If a plug-in developer uses special syntax, I believe they do not have much programming experience with jQuery or JavaScript.

Some plug-ins accept a jQuery object as a parameter, but do not allow chained use of this object, for example, $. myPlugin ($ ('A'); instead of $ ('A '). myPlugin (); this is a big warning.

Code:

$('.my-selector').myPlugin({opt1 : 75,opt2 : 'asdf'}); $('.my-selector').myPlugin({opt1 : 75,opt2 : 'asdf'}); $.myPlugin({opt1 : 75,opt2 : 'asdf'}, $('.my-selector')); $.myPlugin({opt1 : 75,opt2 : 'asdf'}, $('.my-selector'));

　　5. Few or almost no documents

Without documentation, it is very difficult to use a plug-in, because this is the first place to come up with answers. There are various formats for files. Proper files are the best, but good code comments can be the same. If there is no document or a simple example posted on a blog, you may have to consider other options. Good documentation indicates that the plug-in author cares about users like you. It also shows that they have studied other plug-ins and know the value of good documentation.

　　6. Poor Support records

Lack of support indicates that it is difficult to get help when a problem is detected. It indicates that the plug-in has not been updated for a while. One advantage of open source software is that it attracts a lot of attention and helps you debug and improve. If the author does not talk about these people, the plug-in will not be updated.

When was the last update of the plug-in you considered? When was the last message? Although not all plug-ins need a powerful support system like jQuery plug-ins. Be cautious with plug-ins that have never been updated.

With historical technical support records, the author can respond to bugs or make it a green sign. A support Forum further demonstrates that this plug-in has good support, even if not the author at least has a forum to solve the problem for you.

　　7. No compressed version

Although there is a fairly small warning, if the plug-in Creator does not provide a compressed version based on the source code, they may not be too concerned about the performance. Of course, you can compress it by yourself, but this warning is not about a time-wasting problem: this implies that the plug-in may contain more serious performance problems.

On the other hand, providing compression, packaging, and gzipped Version Download is a sign.

　　8. Need a strange Mark-up

If a plug-in requires mark-up, the mark-up should be of high quality. It should conform to the semantic sense and be flexible enough. In addition to poor front-end technologies, the strange mark-up will also make integration more difficult. A good plug-in Inserts almost anything that covers any commonly used mark-up. Using a bad plug-in is better to skip the Fire Circle.

In some cases, strict mark-up is necessary, so it should be allowed to be used within a certain range. Basically, more specific functions and more specific mark-up needs. Fully flexible mark-up is the simplest integration of jQuery's choice from any natural descent.

　　9. Over-using CSS

Many jQuery plug-ins include CSS. The quality of css is the same as that of JavaScript. Too much CSS is definitely a bad sign. But what is "excessive" depends on the purpose of the plug-in. Focus on display, such as lightbox or UI plug-ins, and require more CSS than simple animation-driven plug-ins. A good CSS style makes it easier for programs to adapt to your theme style.

　　10. No one else uses it

JQuery has a large number of users, and the most decent plug-in may have something they write, even if it is a "50 jQuery [fill in the blank]". For example, if you have made a simple Google search plug-in and you have few search results, you may have to consider other options unless the plug-in is brand new, or you will find a professional plug-in engineer to modify it.

　　11. Use and observe

The best way to test the plug-in is to simply run it on the server and check the results. First, does it break some rules? Be sure to check the JavaScript code snippet. If the plug-in contains a style sheet, check the layout and style errors of each webpage.

What is the effect of this plug-in? If it runs slowly or webpage loading is quite slow, consider other plug-ins.

　　12. Use JSPerf for performance evaluation

Improve the Display Effect of your plug-in to a new level and use JSPerf for testing. Benchmarking runs a group of operations multiple times and returns the average execution time. JSPerf provides a simple method to test how fast a plug-in runs. This is an important way to select two almost identical plug-ins.

　　13. cross-browser testing

If a plug-in has a lot of CSS, you must test the style in all the browsers you want to support. Remember that CSS can come from external style sheets and internal JavaScript.

Even if the plug-in does not have any CSS, check JavaScript errors on all browsers anyway (at least in the earliest version of the IE browser you support ). JQuery's core has already dealt with most cross-browser problems, but plug-ins often use some pure JavaScript, which often breaks the rules of old browsers.

　　14. Unit Test

Finally, we will further consider cross-browser testing-unit testing. Unit testing is a simple way to test component plug-ins. It supports any browser or platform. If the plug-in author's downloaded package already includes unit testing, you can bet that this plug-in can work across browsers and platforms. Unfortunately, a small number of plug-ins only include unit test data, but this does not mean that you cannot use QUnit plug-in to perform your own unit test.

Use the minimal setting to test whether the plug-in method returns the expected results. As long as one test fails, do not waste your time on this plug-in. In most cases, executing a unit test is a waste of time, but QUnit can help you determine the quality of the plug-in.

Conclusion

When evaluating the quality of a jQuery plug-in, evaluate the code quality first. Is JavaScript optimized and error-free? Has CSS been adjusted and valid? Is the mark-up naming semantics flexible enough? These problems all come down to the most important question: is this plug-in easy to use?

The core of jQuery is optimized and checked for errors. It supports not only core team members, but also the entire jQuery community. Although it is unfair to use the same standards to measure jQuery plug-ins, there should be at least some of the same review standards.

Javascript jquery: Do you need to learn jquery? I always think it is not perfect to use others?

I will send you a video explaining the javascript of a Microsoft lecturer! You use Baidu hi to return to my message. More than 600 mb of files have a total of 15 sets. The first level has talked about jquery.
You will never regret it.

What aspects does the jQuery library mainly use?

JQuery allows you to easily process HTML documents, events, and animation effects, and provides AJAX interaction for websites. Its documentation is comprehensive, and various applications are also detailed. There are also many mature plug-ins to choose from. This allows you to separate the code from the html content on your html page. That is to say, you don't need to insert a bunch of JavaScript code in the html to call the command. You just need to define the id.