Getting Started using the Eclipse

All of the files need for running the jsLex Eclipse plugins are available on the update site http://www.rockstarapps.com/update

Step 1: Install Plugins

  1. Use the "Software Update" functionality of Eclipse to include the jsLex plugins. Go to the menu '''Help -> Software Updates -> Find and Install..."
  2. Choose the "Search for new features to install" option and click next

Remote Update Site

  1. Create a "New Remote Site" and enter the URL http://www.rockstarapps.com/update
  2. Make sure the site is selected and click "Finish" a new wizard will appear and follow it all the way through until the plugins are installed.

Archive Update Site

  1. Create a "New Archived Site" http://www.rockstarapps.com/update/jslex-update-site.zip
  2. Keep clicking through the screens until it is installed.

Testing it worked - right click on a folder in the Navigator view and see if there is a "Rockstarapps" menu item.

Step 2a: jsLex Site Optimization

All of the following tasks can be access by right click on resources (Files) in the Eclipse or selecting text inside of an Editor.

CSS Concatenation and Compression

Provides the ability to concatenate several CSS files into a single file. Right click on multiple CSS files, select several tags, or "@import url()" statements in an editor. Click here

JavaScript Concatenation and Compression

Provides the ability to concatenate several JavaScript files into a single file. Right click on multiple JavaScript files or select several tags in an editor. Click here

Creating Sprites

Create a sprite from multiple image files. Right click on multiple image files to create a sprite. Click here

Export CSS and JavaScript

Clean up your HTML files by exporting embedded JavaScript and styles to separate files. Right click on either a tag or tag in an HTML file and select the appropriate "Export..." menu item. Click here

JavaScript size analysis

Breakdown of what is taking up the most space in your JavaScript file. Rick click on a folder that contains JavaScript and select the "Rockstarapps -> Break down JavaScript file size". Click here

Step 2b: Deploy the jsLex Web Application

You will need to place the jsLex Web Application onto a server. Either a PHP or J2EE server will work, but you can use any server tier. We will assumed you already have a web application that is or can be deployed to a server in your eclipse environment. Right click on what is your applications root folder. If you are using Eclipse's WTP project than this would be "WebContent", if you are using Aptana than this would be the project itself. Click on the "Rockstartapps -> Step 1.) Unzip jsLex Web Application.

This will place the application as a sub folder called "jsLex" of the currently selected resource. Inside of this folder are all the contents needed to run jsLex.

Once you have setup the Web Application you can test it by going to your web browser and typing in the URL - http://host:port//jsLex/jsLex.html

NOTE: The jsLex profiling application requires a JRE to be installed on your machine. Go to wwww.java.com to get the latest, if you don't have one.

OptionallyAfter the Web Applicaiton has been deployed you will need to configure the Web Application parameters to best fit your environment. To do this open the Nexaweb/javascript/params.js and the Nexaweb/javascript/profileParams.js files. In these files is a section labeled jsLex Specific Information change the values of the properties in this section as appropriate. Form more information on this Goto Customize the jsLex Web Application

Step 3: Inject profile code

This step is fairly straight forward, right click on the folder that contains the JavaScript for your application and choose the "Rockstarapps -> Step 2.) Inject Performance Markers''' Continue through the wizard. This will create a new directory with a copy of the JavaScript that has been injected with markers to track the codes timing. 

'''------------------------------Warning------------------------'''
This application makes modifications to files, if not configured 
properly it could result in loss or destruction of work.  It would 
be best to make a backup copy of make sure your files are checked 
into to a source control system before using.  I would really 
hate for this application to result in any swearing or tears.
'''------------------------------Warning------------------------'''

Note: The location of the profiling analysis file is important you will need to import this file into the profiling application.

Step 4: Update your Application

You will need to modify your application code to do the following:

  • Include the jsLex JavaScript library
  • Open the profiling window
  • Point your application code to the compressed files.

Go to - YourApp for more information.

Step 5: Using jsLex

Using the jsLex application is quite simple. Contained in the install is two starting pages jsLex.html and profile.html the will launch the application.

Goto the Users Guide for more information on these two applications.

Search: