socket.io source script goes like 70k, a great part is comments, spaces...
I need to reduce that script to a smaller size
Some scripts do not even have spaces and the code is all toghether, this reduces the script original size.
Where is the location of the socket.io script so that I can remove comments and spaces?
Or is there a socket.io allready whithout comments and spaces with a smaller size?
There is a setting in the socket.io configuration for this:
https://github.com/LearnBoost/Socket.IO/wiki/Configuring-Socket.IO
browser client minification defaults to false
Does Socket.IO need to send a minified build of socket.io.js.
You may also enable gzip compression on the library.
The client .js file is in *yourdir*/node_modules/socket.io/node_modules/socket.io-client/dist
There is one file called socket.io.min.js which is minified already.
The OP fixed the problem by going to /node_modules/socket.io/lib and editing 'manager.js', to set both "minification" and "gzip compression" to "true". They had to do this way because because they were using nowJS which indirectly uses 'socket.io'
This reduced the file from 70k to about 4k!
it seems socket.io is either returning some other file or returning by building at run time.
I replaced socket.io.js by renaming the min one. cleared cache of browser but still getting the old file.
Related
I just started playing with node debugger and noticed a node.js file which is invoked at the very beginning of node execution.
As the comment in the file says
This file is invoked by node::Load in src/node.cc, and responsible for bootstrapping the node.js core.
I'd like to change content of this file to something else (yes, I know there's no need to do that), is there a way to replace content of that file / specify path to new file without compiling node from source?
Short answer: Nope.
If I read the source correctly, the file node.js gets compiled into the resulting binary, as a string - the file itself does not exist anywhere on the filesystem so you cannot modify it and, for the same reason, you cannot tell Node to execute your own version of it.
Best look at the sources - mainly the LoadEnvironment method.
I have created a web site using backbone + requirejs + bootstrap on client side and php REST on server side. The site contains a lot of .js file. I use requirejs to load the .js when it is needed (to implement asynchronous loading).
However, I have start using Node.js + Yeoman + grunt + bower recently. I use Yeoman webapp generator to create the basic structure of my web again. When I build my web, it concat all the .js files into 1 single .js file and put the tag on the index.html to refer it.
From my understand the pros is that the whole .js is cached in client's browser. which is slow at first time visit, but fast on re-visit. Since everything is concat to 1 file and it is loaded to the client's browser, so I guess the asynchronous loading is not work in this case. (correct me if I wrong).
* the web site is created for both mobile and desktop. (1 src for 2 version)
Should I concat all .js files in 1 single file
OR should I use requirejs to require the .js when I need it (Asynchronous loading)?
How to config requirejs in Node. I have tried it in normal way (include the data-main in index.html, when I compile using grunt build. it give me error "... is no more support".
Is browserify similar to requirejs in Node?
I have spent a week to figure it out already but still no luck. Hope someone can point me to the right direction. Thanks a lot.
The .js file structure is something like this:
-app
-vendor
-jquery.js
-backbone.js
-assets
-js
-model
-person.js
-collection
-people.js
-router.js
-controller.js
-dist
-js
-build.js
i had familiar issues. So lets start with strategy of file concatenation. There are three major ways to follow:
first - always concat all modules in one file, in this case you loose on first start and may win or next starts, but you can face another issue - you use less then half of modules from concatenated file at a time, but always load all modules.
second way is to build specific concatenated file with specific module set for each type of page - so you know how many page type you have and build file for each - following this you can decrease size of file, but its hardly to maintain and need manual sets correction in case of page changes.
third - build 1 concatenated file with libs and modules which in use nearly on all pages, all other stuff (additional modules, views, special models and collection) load on demand. This way is good in case of SPA pages.
Let me say a few words about grunt + r.js configauration.
Keep this link for first times .
Here is the sample of config:
requirejs: {
compile: {
options: {
baseUrl: "path/to/base",
mainConfigFile: "path/to/config.js",
name: "path/to/almond",
out: "path/to/optimized.js"
}
}
}
Main point here mainConfigFile - it is a file then you keep require.config
Next step - configure r.js - keep this link its very helpfull as describe all possibilities of r.js.
Usually its quite enough to checkout these links.
Also you can checkout recommend file structure for multi page site to avoid issues in future.
Also here is a link to a similar post - you may find it usefull.
If you have any additional questions let me know.
And a few words about CSS - logic nearlly the same : you can build separate file for each page or create sinngle. The main point here is how large your site is. In my case i've choose second option, but to be honest first one is more scalable, especially in large projects
I can get the requirejs work with Backbone now. However, I cannot use Marionette with error something like "Backbone is undefined". I've install Marionette with this command "bower install marionette --save". I did some search on google, and someone said use the AMD version of Marionette should fix this issue and after replace Marionette with AMD version it is work.
But my question is how can I install the AMD version of Marionette using "bower install"?
My web use bootstrap. When I compile the web with "grunt build". it copy bootstrap's font from "app/bower_components/bootstrap/dist/fonts" to "dist/bower_components/bootstrap/dist/fonts" but the web is refer the font on "dist/fonts". How can I change it to refer to the right directory?
I use yo webapp (with bootstrap) to generate the structure of my web.
I'm looking for some middleware modules that allow me to render ".css" from ".scss", ".html" from ".jade", ".js" from ".coffee" on the fly without rendering to disk.
Every module I've encountered so far wants to write to disk before serving it instead of just streaming it.
Obviously this is only for local development since I'm not interested in dealing with file-revving and caching problems.
Answering my own question here:
The middleware to use is compile-middleware. Works fine by default with connect, but with express I had to modify it in order to not write headers (ugly i know, but time waits for no one) : https://github.com/airtonix/compile-middleware
implementation:
https://gist.github.com/airtonix/9601224
Original Credit goes to (You should try using this one first):
https://github.com/shinohane/compile-middleware
You should simply use a JavaScript task runner like:
Grunt: http://gruntjs.com/ or
Gulp: http://gulpjs.com/
These plugins could help you get started (gulp related):
https://www.npmjs.org/package/gulp-watch
https://www.npmjs.org/package/gulp-jade
https://www.npmjs.org/package/gulp-coffee
https://www.npmjs.org/package/gulp-sass
Here's a simple tutorial: http://www.codersgrid.com/2014/01/11/gulp-js-streaming-build-tool-beats-grunt-js/
I got nothing against grunt, both of them are awesome :)
Hope it helps!
On server side I am using Connect and Socket.IO. I want to serve my client side code (also CofeeScript) to be compiled (to JavaScript), uglyfied and gzipped. I looked for Conenct middleware to do this to me and found uglify-js-middleware and gzippo.
However I am not sure what's a good way to have it converted to JavaScript first (is there no API or something?) and whether I should use temporary directories for every step so I can use the src and dest options of uglify-js-middleware and gzippo or whether there is a better way to pipe it through all these things.
It's okay when this simply gets done when starting my application and so I don't care about checks or anything. I could probably use Cake somehow, but I don't really want to add an extra script for this and it would be cool if I could just pipe it so I don't have the need for temporary directories.
Is there maybe some kind of Middleware that does all of this? I really don't think I am the first one who wants to do this.
Oh and maybe the CofeeScript from a client side directory could be combined into one file, but I guess that's not really a problem.
Ah, if only someone had written a Connect middleware modeled on the Rails 3.1 asset pipeline... oh wait! I recently did: http://github.com/TrevorBurnham/connect-assets
It's pretty early-stage, but it does exactly what you want: compiles CoffeeScript files to JavaScript, concatenates and minifies them in production mode, and doesn't create new files (so no extra git diffs). Try it out and let me know what you think.
check out the compiler middleware: http://senchalabs.github.com/connect/middleware-compiler.html. It does exactly what you want.
app.use express.compiler
src: "#{__dirname}/public/scripts"
enable: ['coffee-script']
http://docpad.org can compile it on the server-side very intuitively
Has anyone seen Mincer?
https://github.com/nodeca/mincer
I'm choosing a solution now, so I haven't vetted it yet, but looks like it's strongly based on Sprockets, like connect-assets.
I building my sites on the localhost (runs wamp on windows), and when I upload it to my server, I always get
"Cannot modify header information - headers already sent"
I understand that there shouldn't be any blank lines and everyhing, and usually this works out. but now I need to redirect someone after the header has been sent, how can I make my server act like my localhost ?
i'm using cpanel and WHM:
cPanel 11.25.0-R42399 - WHM 11.25.0 - X 3.9
CENTOS 5.4 x86_64 virtuozzo on vps
I will appreciate any help
In short, you need to prevent PHP from outputting anything to the browser before you get to the point where you want to use the header() function.
This should be done by careful programming practices, of which your 'no blank lines' is one, or by storing PHP's output in an output buffer, and only outputting when you're ready for it.
See the ob_start() and ob_flush() methods. You use ob_start() at the start of your application. This disables output and stores it into a buffer. When you're ready to start outputting, use ob_flush() and PHP will send the buffer's contents to the browser, including the headers that are set till that point. If you don't call ob_flush() then the buffer is output (flushed) at the end of the script.
The reason why it works on your WAMP development environment is most likely that output buffering is already enable by default in the php.ini. Quite often these all-in-one packages enable a default buffer for the first 4k bytes or so. However, it is generally better to explicitly start and flush the buffer in your code, since that forces better coding practices.
Well,
I guess by more thinking and better programing you can manage to keep all redirects before any HTML is written.
This problem solved by the old rules...
#user31279: The quickest and dirtiest way I know of is to use # to suppress the warning, so e.g.
#header('Location: some-other-page.php');