Reducing the need for JavaScript libraries - javascript

I'm writing several small things in JavaScript, notably a mousemove event, and a AJAX call. I don't believe that two things should necessitate loading the ~25KB that is jQuery. Add in the fact that I want as few external dependencies as possible and necessitating jQuery isn't something I want to do.
Is there a primer / tutorials on rewriting calls between a JavaScript library and pure JavaScript?
$('element')
$.get()

For the selector part $("element"), you might as well use Sizzle, which is the same library used in jQuery and other JS framworks, and is only 4kb (minified and gzipped).
As for the $.get() call, a simple wrapper around the native XMLHttpRequest object should suffice, depending on what features exactly do you want to provide. Check the Mozilla Developper Center docs for some pointers.

jQuery uses Sizzle for its selectors magic. I can't remember if it weighs 3 or 7 kB but it's a standalone library

You can study the library code, and write your own IF you want to.

Related

Is jquery a **normal** library to javascript the same way Math is a library to c++, python or even js?

I'm new to web development, I'm discovering javascript and all its capabilities. I'm currently learning jQuery and it made me wonder: "what really is a library ?".
From some so/internet search I understand that jQuery is a library, although some people also consider it a framework as it help/force you to change the way you code js.
For me, a library is a set of functions and classes to help the programmers on a particular point.
As I understand it jQuery doesn't seem to only add function or classes contrary to other javascript libraries such as math, for example or even other jQuery plugins like datatables etc...
To me, jQuery at its base just looks like another way of presenting js code.
So to summarise my questions are:
Is jQuery a "normal" library like Math for c++, python or even js?
How does the js engine understand jQuery? (some sort of compilation ?)
Can every js engine understand jQuery as long as they have the jQuery.js file, or is there something already embedded inside the engine for jQuery.
I also took a look at this very interesting so post on Is a jQuery compiler possible?, but it just blurred me the line between library and jQuery even more.
Any hint or link to how js/jquery combine would be helpful!
Is jQuery a "normal" library like Math for c++, python or even js?
Yes. It's just a collection of functions, etc.
How does the js engine understand jQuery? (some sort of compilation ?)
jQuery is just code written in JavaScript using the standard features of the browser (the DOM, etc.). (Well, and some non-standard ones it feature-tests for to get around browser idiosyncracies.)
Can every js engine understand jQuery as long as they have the jQuery.js file, or is there something already embedded inside the engine for jQuery.
jQuery is designed for the browser environment, so it won't work correctly in a non-browser environment without additional dependencies (a DOM library, etc.).
For the avoidance of doubt: There's nothing you can do with jQuery that you can't do without jQuery, using JavaScript's standard library, the DOM API, and other browser APIs directly. All jQuery does is provide an alternate API for doing DOM manipulation, provide some utility functions, and define a standard way to add features to extend jQuery with more functionality (e.g., "jQuery plugins").
And for completeness:
jQuery is not a language, although it's a common misconception that it is. You don't do something "in jQuery" or "in JavaScript." The correct contrast is "with jQuery" or "with the DOM" (or "without jQuery").
There are other libraries which also fill the same sort of "make the DOM easier" niche, although jQuery is by far the most successful of them.
There are entirely different approaches to handling browser-based interfaces, provided by a spectrum of projects from libraries (like KnockoutJS and many others) through light(ish) frameworks (like React and others) to full-on frameworks (like AngularJS and many others).
Its pretty simple how you understand a library and a framework when it comes to jquery its a library because it dose'nt add any additional jquery approch whatever you see in jquery is present in javascript what jquery does is shorthand your code and help you chain functions which was not that much possible in javascript and when it comes to plugin they all are also part of javascript functions

Javascript or jquery?

I'd like to ask a simple question,
Should I use javascript or jquery?
For all I know, jquery is difficult for me to learn (the ajax part at least) and I already know javascript and how to do almost everything in javascript. In some functions I have to say that in my website I used jquery mostly because of the fancy animations but only for that. That is as far as I can go with jquery. So will jquery offer me more in performance or not? Should I learn jquery to create the ajax functions or just stick with javascript?
Also I know it wouldn't be ideal but do you believe that using both jquery and javascript (of course for different functions) will be buggy??
Thanks in advance.
EDIT: Of course I know that jQuery is a Javascript framework I'm asking if it will offer something more in performance thanks.
jQuery is Javascript.
It's just a set of Javascript functions that many people find very convenient.
jQuery.ajax in particular is much easier to use than the native XMLHTTPRequest.
There is nothing wrong with calling functions that aren't defined by jQuery.
jQuery is JavaScript. It's only a framework. So you are totally safe to use both.
Answering your updated question on how jQuery frameworks offer you more than dealing with plain JavaScript:
Write less code and do more
Cross-browser compatibility out-of-the box
A lot of really good plugins available
You should not worry about performance. jQuery gives you so much more.
jQuery is a JavaScript library, so in order to use jQuery you have to be using JavaScript.
That being said, you're free to use both. Use plain JavaScript where you want, use the jQuery library for code which is more clearly expressed in jQuery.
jQuery IS Javascript actually.
But for question, just use both, because jQuery is faster for some stuff, but it is limited. It is only Javascript library.
jQuery is javascript.
That said, if you already are using jQuery in your website, I'd recommend making use of its ajax support. It really is much nicer than attempting to write your own cross-browser implementation.
A question for you - you say you know javascript very well, so have you created a javascript plug-in? ie. a set of reusable functions that you use throughout your site?
jQuery is just this - nothing more. It is a wrapper around javascript that saves a lot of time and code in certain situations.
jQuery does not offer anything over Javascript in terms of performance. It's purpose is to make development easier, better and more productive.
You can do the same functions that jQuery does with Javascript, because jQuery is made with Javascript code.
jQuery tries to simplify a lot the visual and selection tasks that are more tedious with JS.
Use jQuery and, when you need to be more specific, add JS.
As others have noted jquery is javascript..
absolutely jquery, in my opinion, animation is not most amazing part. With jquery you can handle the cross-browser javascript code very easily, and i think the ajax part is so much easier and flexible than the pure javascript xmlhttprequest.
Yes, I would definitely go for jQuery. At start it seems to be a bit difficult, but you'll soon find out that jQuery is way easier to use and better in performance.
After all Javascript takes like 20 lines to make an Ajax call. jQuery would just do (for example):
$.ajax({
type: "POST",
url: "yourscript.php",
data: ({ id : retrieved_id,
firstname : firstname }),
success: function(data) {
$('#txt_id').html(data);
}
});
jQuery will ease up a lot of things for you. I used to be familiar with Javascript too and I was a bit hesitant to start using jQuery, but now I cannot live without it anymore!
Keep in mind though that jQuery IS just like a Javascript library. So you will still be using Javascript.

Is there a way to make jQuery .js file only contain the functions I use?

Well, I am using jQuery in my project, but I really don't use any effects, only the $.ajax function, is there a way to make jQuery .js file only contain that function or maybe a similar function that doesn't depends on jQuery?
I am coding a library, so I don't want to have a jQuery dependence.
There isn't an easy way to do this, the library is built as a library, meant to be intact. Getting only what you want is easy...getting all dependencies for those methods is a different matter. It's really not worth the trouble for the size you'll save, and the pain you'll experience repeating this for every new jQuery release you update to.
The library is minified (which you should be using in production) and should be delivered via gzip, you're actually transferring very little to the client, and they should be caching it after the first time, if your headers are set correctly.
If the only thing you need is Ajax functionality, why not try the jx library?
http://www.openjs.com/scripts/jx/
This seems like a case of premature optimization (which is the root of all evil ;)). Basically you won't gain anything from this. Basically you could just as well write the XHRs by hand in pure javascript.
You could always (but I really don't recommend it) extract the methods you need form the source code: jQuery source. Or if you only use the ajax functionality you could build you own ajax methods. Checkout w3's guide of ajax Ajax tutorial
..fredrik

Is there a general purpose JavaScript library out there?

We started a new project and realized that we needed a general purpose javascript library that contains a nice set of string functions, MD5, base64, allows extensions, etc. Also, copying and pasting functions from other libraries doesn't sound very attractive.
So, I guess the question is which javascript library contains the most general purpose functionality out there? or maybe there is a good collection of global functions out there we could use/extend. We know DOM manipulation is covered by many AJAX libraries including JQuery.
*Mind you, we could alternatively extend ExtJS, JQuery, etc. Is that what you guys are doing?
Google Closure Library
It contains (quoted from link):
a large set of reusable UI widgets and controls, and from lower-level utilities for DOM manipulation, server communication, animation, data structures, unit testing, rich-text editing, and more.
It also contains a nice set of string manipulating methods, in goog.string namespace.
Underscore
Underscore is a utility-belt library for JavaScript that provides a lot of the functional programming support that you would expect in Prototype.js
Underscore is intended to go along with other library, like jQuery or prototype.
It's not extensible like jQuery or Google Closure, though.
*Mind you, we could alternatively extend ExtJS, JQuery, etc. Is that what you guys are doing?
Yes, I do and I think most are. A lot of what you describe as a "general purpose library" is covered by Frameworks like JQuery, Prototype or Moo. And short of clipping the webmaster's nails, there's a JQuery plugin for everything that's not already in the core.
Still, I'm interested to see whether any other "general purpose" libraries come up here. There are fields - like string manipulation, as stated in one of the comments to another answer, and advanced date operations - where none of these frameworks is the holy grail AFAIK.
I use the jQuery library and a bunch of plugins. jQuery's plugin directory contains a lot of useful tools. There's also jQuery UI, a set of interactive components and effects, which you can use if you don't want to use a more complex library like ExtJS.
Of course every project is different, and you will probably end up writing some helper functions on your own.
I realize that others are going to say the same, but jQuery truly amazes me every time I learn something new about it.
DOM, CSS, and event manipulation along with easy AJAX, extensibility, and the plethora of existing extensions make jQuery a wonderful tool for web development.
jQuery is incredibly useful for UI manipulation. However, being open source, it contains some less than optimal code. If you start running into performance issues, don't be afraid to delve into the source and see what's going on.
I have been using jQuery for some time now and that seems to handle most of the basic operations I need. It has a healthy library of plug-ins and you can always write your own. It is a very good lightweight js library and even if it doesn't do all that you need it to you it is a good starting point.

ASP.NET MVC without MicrosoftAjax.js and MicrosoftMvcAjax.js

What parts of functionality will I lose after removing the
MicrosoftAjax.js
MicrosoftMvcAjax.js
files?
I don't want to use them for various reasons and I thought if there were any 3rd party helper methods that would mimic existing ones but are tied to another JavaScript framework, such as jQuery.
Also, please tell where usage of above javaScript files is preferrable/adviced.
Many thanks,
Valentin Vasiliev.
You won't be able to use the AjaxHelper extension methods (in the System.Web.Mvc.Ajax namespace) that are exposed by the Ajax property on the ViewPage class if you don't refer to the MicrosoftAjax scripts. They're relatively easy to replace by using the appropriate jQuery AJAX methods ($.post, $.get, $(selector).load etc) or the jQuery form plugin.
As for whether one or another is preferable or not it's down to how comfortable you are with writing your own implementation. The Ajax helper methods try to take care of a lot of things for you in terms of client script programming but that comes at a price of having to load in the pretty heavyweight MS AJAX library. Rolling your own javascript methods can lead to more lightweight code as well as providing you with a choice of javascript library to use (be it jQuery or one of the many others out there).
I agree. Just use jquery. Life is good with .net mvc 3.5 and jquery. cheers
You don't need those. Just remove them. Use JQuery instead.

Categories