Category: PhoneGap

Is jQuery Too Big For Mobile?

jquery_big_mobile_header

Obviously a lot of people worry about performance. I watched a video from phonegap about developing games on a mobile device. What the guy was saying was right, jQuery is slower than getElementBYId and that jQuery could be overkill. But its still nice to see the numbers behind jQuery rather than just opions.

From my time contracting I met a lot of people, In fact during my small perm jobs (Zone, Independence United) that let me go I realised two things. People are annoying and secondly, which is why they are annoying, they have preconceptions about coding practices that are just plain wrong. But when speaking to them about it its matter of fact for them. There is no discussing, they are disgusted with you for not knowing. I walk away and think,

That’s not right. wtf are they talking about?

But sadly at the time of the argument I don’t have enough knowledge to back up my bumfoundedness in what their thoughts were. Of course I think this more has to do with the individual as if the people aren’t dicks and they know more than you, you discus and learn from them.

Fuck, what was the point of this post? jQuery, its not that bad on a modern mobile 😉

This question gets asked a lot, and I’ve yet to see a data-based exploration of this topic. Terms like “big” and “bloated” are relative terms; they don’t mean anything without numbers to back them up. The real question should be – “Does the size of jQuery adversely affect the users of my applications enough to outweigh the development conveniences that the library provides?”

But my favorite and most obvious quote is here:

There’s Almost Certainly Something Way More Important to the Efficiency of Your Application Than Whether You Use jQuery

According to the HTTP archive the average Web page now

  • is over 1.7MB,
  • makes over 90 HTTP requests,
  • has over 275K of JavaScript,
  • makes 17 HTTP requests for JavaScript alone,
  • includes over 1MB of images,
  • makes only 46% of its resources cacheable.

So before you care about jQuery, first make sure you

  • minify your CSS/JS assets,
  • concatenate your CSS/JS assets,
  • gzip your HTML/CSS/JS assets,
  • compress your images,
  • set appropriate cache headers,
  • remove unnecessary HTTP requests.

Often removing an image or two can improve your performance more than removing jQuery, and is far easier to do. If you have performed all these optimizations, and are still experiencing performance issues on mobile devices, then look into removing libraries like jQuery – just make sure you cover your bases first.

See the article here: Is jQuery Too Big For Mobile?

So, read it understand it and before you start bashing technologies look at the other fucking stuff on your site.

 

 

by Jamie Hutber Categories: Cocks, Front End, javaScript, jQuery, London, PhoneGapLeave a comment

Using android studio to compile phonegap apps in cmd setup – Windows

I am just writing down the shit here so that when I move to a new pc I can just copy and paste the detts.

Things we’ll need:

Step 1 – Installing stuff

Android Studio

Download and Install Android Studio.

Step Android 1

The location is up to you, but I find it easiest to put it at the root of my C drive. I conveniently created a folder amply called “phonedev” folder.

C:\phonedev\sdk\

Step Android 2

Once installed you’ll just have a folder full of stuff.

Java JDK

I’ve already got this installed so can’t take print screens for myself.

But good, its installed.

Node.js

Bog standard install please.

Phonegap

With node.js installed we can now install phonegap. From cmd (start->run->cmd) sudo npm install -g phonegap

Apache Ant

Download the latest version, this can be any format you want, I go with zip as it has the most support: http://tweedo.com/mirror/apache//ant/binaries/apache-ant-1.9.3-bin.zip

step ant 1

Extract that to the phonedev folder you created eariler, it should like this once extracted: C:\phonedev\apache-ant-1.9.3 and for now you’re done.

step ant 2

 

System Variables

Now is the fun part:

bring up the advanced system variables. Easiest way is hitting Windows Key+Pause on your keyboard. This will just bring up the Control Panel -> System From there you want to click the Advanced system settings:

system settings

Then click Envrionment Variables This little guy is where we tell the computer where the hell we installed anything.

enovi

 

Adding new variables

You need to add two new variables, to do this click New under the System variables section. Thats the second new tab in this little window.

Now add these two:

  • ‘ANDROID_HOME’:’C:\phonedev\sdk’
  • ‘ANT_HOME’:’C:\APACHE-ANT-1.9.3′

new ones

 

Now scroll down the list and fun straight up Path

Now add the following to the end of the list:

  • C:\PROGRAM FILES\JAVA\JDK1.7.0_45\BIN;
  • C:\PHONEDEV\APACHE-ANT-1.9.3\BIN;
  • %ANT_HOME%\BIN;
  • %ANDROID_HOME%\TOOLS;
  • %ANDROID_HOME%\PLATFORM-TOOLS;

or if its more simple just paste this in at the end.
C:\PROGRAM FILES\JAVA\JDK1.7.0_45\BIN;C:\PHONEDEV\APACHE-ANT-1.9.3\BIN;%ANT_HOME%\BIN;%ANDROID_HOME%\TOOLS;%ANDROID_HOME%\PLATFORM-TOOLS;

Worth noting that before pasting this in, make sure the last variable in the last already has a ; Otherwise it’ll just break things.

Before Pasting… Notice the trailing ;

before pasting

After Pasting

after paste

 Verifying things worked

  • Check Ant: ant -version
  • Check Node: node -v
  • Check Java: java -version
  • Check Phonegap: phonegap -version

If all went well all of the above will look like this:

checks

 

At last the best bit, check everything is working.

Phonegap create helloworld

Now move into that folder:

cd ./helloworld
 
phonegap build android
build

Now cream everywhere!!

Although there is actually a lot more you should know, but as i’m just doing it for reference when my PC next crashes, maybe if somebody ask’s I’ll do it.

by Jamie Hutber Categories: PhoneGap, TechLeave a comment