This is the second version of jscompress.com: it's modular, has more features (eg drag'n'drop) and works 100% on client-side.
Check out CONTRIBUTING.md before making pull request.
Site to minify/compress javascript and combine multiple files into a single compressed file
Home Page: http://jscompress.com
License: ISC License
This is the second version of jscompress.com: it's modular, has more features (eg drag'n'drop) and works 100% on client-side.
Check out CONTRIBUTING.md before making pull request.
The following code snippet doesn't compress using jscompress.com:
function copyAttributes(src, dest, attrList)
{
for(attrName of attrList)
{
dest.setAttribute(attrName, src.getAttribute(attrName));
}
}
This make me think that jscompress.com doesn't support the for..of
loop.
I went to jscompress.com, it just deleted my line breaks
Why doesn't it rename the variables declared in the script?
The website gives an error when finding an equals symbol in a function argument list.
E.g
function example(param1, param2 = 5) {
return param1 + param2;
}
This is accepted code for declaring a default for a function argument.
Currently click on Download will download jscompress-result.zip containing compressed.js .
I propose to download it directly as compressed.js, know that you can simply use HTML5 element attribute download="compressed.js"
for it, examples in https://www.w3schools.com/tags/att_a_download.asp
Spec details https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#Attributes
var asciiLetters = ["🇦", "🇧", "🇨", "🇩", "🇪", "🇫", "🇬", "🇭", "🇮", "🇯", "🇰", "🇱", "🇲", "🇳", "🇴", "🇵", "🇶", "🇷", "🇸", "🇹", "🇺", "🇻", "🇼", "🇽", "🇾", "🇿"];
Minifying this results in:
var asciiLetters=["�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�","�"];
EDIT: 🔵 also converts to �.
Hi, could you please enable the following ecmaScript syntax sugar.
[Project]
File constants.mjs: SyntaxError: unknown: Support for the experimental syntax 'importMeta' isn't currently enabled (4:59):
2 | import { fileURLToPath } from 'url';
3 |
> 4 | export const __home = (() => dirname(fileURLToPath(import.meta.url)))();
| ^
5 |
Add @babel/plugin-syntax-import-meta (https://git.io/vbKK6) to the 'plugins' section of your Babel config to enable parsing.
File Controller.mjs: SyntaxError: unknown: Support for the experimental syntax 'classProperties' isn't currently enabled (9:11):
7 |
8 | export default class Controller {
> 9 | running = {};
| ^
10 | timeout = {};
11 | inputListeners = {};
12 | buttons = [];
Add @babel/plugin-proposal-class-properties (https://git.io/vb4SL) to the 'plugins' section of your Babel config to enable transformation.
File Controllers.mjs: SyntaxError: unknown: Support for the experimental syntax 'classProperties' isn't currently enabled (8:15):
6 | const SupportedControllers = requireJSON(`/json/supported-controllers.json`);
7 | export default class Controllers {
> 8 | controllers = [];
| ^
9 | mappingSchemasInUse = {};
10 | constructor() {
11 | findSupportedControllers.bind(this)();
Add @babel/plugin-proposal-class-properties (https://git.io/vb4SL) to the 'plugins' section of your Babel config to enable transformation.
we have to delete this all the time.
Having a const variable is not known by the minifier.
In some cases it produces slightly longer code then othere compressors because of this.
It would be nice to auto select the minified content when the user clicks on the text area in the output tab. It's just one line of js.
if you have time it also be nice to have a Copy button near the download button.
This button would copy the minified version to the clipboard (zero clipboard?)
When you have the 2 buttons you may want to color one of them differently as primary one.
P.S. Great service :) I use it all the time.
P.S 2: I am wondering if there would be a business idea if you create an api that people can call curl and it returns raw minified version
You could inject a comment in the compressed file e.g.
/* compressed/minified by jscmpr.com */
jscmpr.com is available and can redirect to the main domain.
Take care,
Slavi
Cannot click links in Firefox in OS X...works in Chrome
(async () => { await someAsyncFunction(); })();
ㅤ ㅤ
I know this is related/due to lack of ES6, etc. support, but it would still be great to have, (without using babel-minify ECMAScript #78), if possible...
change:
@babel/plugin-proposal-class-properties
to:
@babel/plugin-syntax-class-properties
" is converted to "
example
function vaca()
{
el.find(".c-links .c-mini-tooltip-ico").tooltip({content: 'The "Edit as new " feature creates a copy of the current item and opens it for editing.
Don't forget to Save/Publish it after editing. The current item remains unchanged.', className: 'c-tooltip', width: '415'});
}
before minify:
;(function(e)
after minify:
(function(e)
So Js pareser get error:
Example file for conversion:
https://raw.githubusercontent.com/Schepp/CSS-Filters-Polyfill/gh-pages/lib/css-filters-polyfill.js
this tool should has options of minify.
Hey folks - I have been using the https://jscompress.com/ site for a while - thanks! Today, the tool does not seem to work - it tells me 100% compression - even on files I have compressed successfully before. Also... does it look different? You used to have the ES6 compression checkbox on the top right and that is gone. Here's hoping it was just a bad update or something...
Apparently UglifyJS does not parse comments, and just strips out anything with an IE conditional comment:
/*@cc_on
if (/^10/.test(@_jscript_version)) {
$("html").addClass("ie10");
}
@*/
More on this: http://stackoverflow.com/questions/1843247/cc-on-and-ie6-detection
Official docs: http://msdn.microsoft.com/en-us/library/ie/8ka90k2e%28v=vs.94%29.aspx
Hi,
CTRL+A for select all is not working on firefox on the output tab.
Sorry I am not very familiar with github and git overall, I just use your JS compressor pretty often. I last used it yesterday or the day before that and everything was fine, but since today my script stops working after being minified. It works before minified and the minified version I backed up yesterday works too. Have you changed anything?
Sorry I'm not being specific, I just can't find what exactly breaks, since the script is minified and not readable anymore.
The site itself works, but is like super super slow, it must take at least 30 seconds to minify a script and browser just hangs/becomes not responsive in this time. Last week compressing took around 10-15 seconds and the browser wasn't hanging like that.
if (!noquotes) {
string = string.replace(/"/g, '"');
}
gets replaced with
if (!noquotes) {
string = string.replace(/"/g,""");
}
This is completely broken! " should be left alone. a double quote is not a minified version of an escaped quote, they are two different things!
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-89303869-1', 'auto');
ga('send', 'pageview');
</script>
This website is very useful, but it will be even better if the output tab could display the length in bytes of the result.
I understand this is programatically very simple, but when talking about size limitations this is very handy information.
In previous versions of JSCompress, top level var
s would get shortened, so I took to doing some code-golf declarations at the top to squeeze out a few more bytes. However, these do not seem to be working as they used to. For example, here is the top of a large codebase I maintain:
!function(){"use strict";var _window=window,_document=document,_head=_document.head,_undefined,_null=null,_true=!0,_false=!1,_document_currentScript=_document.currentScript,_Object_prototype_toString=Object.prototype.toString,_document_querySelector=_document.querySelector.bind(_document),_document_querySelectorAll=_document.querySelectorAll.bind(_document),_Date_now=Date.now,oCoreOptions={},fnExpectedErrorHandler=function(){},oInterfaces={pub:function(){return{data:{},options:{},ui:{}}}},core=function(e,r){return r?core.mk.arr(_document_querySelectorAll(e)):_document_querySelector(e)};core.ver="0.9.2018-01-12",core.app=oInterfaces.pub(),core.lib=oInterfaces.pub(),core.resolve=function(){var e,r,t,n,o,c,i,a,s={allowFn:_true}...
As can be seen above, the first var
list is being left as-is, while those in the function at the end of the sample above are shortened to var e,r,t,n,o,c,i,a,s={allowFn:_true}...
. I can see the list is still being processed because _true=!0,_false=!1
are present. However, even the non-code-golf-y variables are being left unshortened, like fnExpectedErrorHandler=function(){}
!?
Is this an intentional change? Should I give up on my code-golf byte squeezing or is this a bug to be fixed?
Uglifyjs 3 does support the import statement, but jscompress.com says:
Unexpected token: name «Z1», expected: punc «;» (line: 1, col: 7)
import Z1 from './z1.js';
function test() {
Z1.abc();
}
It does work here:
https://skalman.github.io/UglifyJS-online
JSCompress has recently stopped working.
In FireBug I get a following message:
JS ReferenceError: Symbol is not defined
...erator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done)...
app.js (line 103)
When extending built-in primitives, such as String, the prototype extension is lost.
Example:
String.prototype.trimsplit = function(delimiter) {
return this.match(/^\s*(.*[^\s])\s*$/)[1]
.split(new RegExp('\\s*' + delimiter + '\\s*'));
}
This code gets completely omitted from the compressed output.
However, when putting this code in an anonymous function, it gets correctly compressed and included:
(function() {
String.prototype.trimsplit = function(delimiter) {
return this.match(/^\s*(.*[^\s])\s*$/)[1]
.split(new RegExp('\\s*' + delimiter + '\\s*'));
}
})()
Hi
the app.js file in the js.folder is still missing in the download package. How to get that?
also the babel transfrom js files are missing
vendors~babelTransform-chunk-24844acb4277512e70fd.js
babelTransform-chunk-fe622da15389dffa17f3.js
please advice
Do i have to build these files myself? If so how ? Please advice.
Thank you
Is there an api that I can use to pass some code through and it will minify it via nodejs.
I notice an issue with (non-ASCII) chars.
e.g.
function x()
{
return /\w/.test(ch) || ch > "\x80";
}
will compress to:
function x(){return/\w/.test(ch)||"�"<ch}
var x="& amp;";
will become
var x="&";
When I try to compress a script with a class on the site (https://jscompress.com), it gives me an error. Take this simple example:
class MyClass {
constructor(item) {
this.item = item
}
thing() {
alert(this.item)
}
}
new MyClass()
It gives me this an error:
Unexpected token: name «MyClass», expected: punc «;» (line: 1, col: 6)
I would really like class compression, as it is supported in a lot of browsers:
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes
I'm currently using your jscompress and feel so good
Today, my js code could not be compressed as usual ( I adready try both paste code and upload file)
Here my js code, can you reprocedure it and fix it
$(document).ready(function() {
if ('@Model.ContractId' > 0) {
sessionStorage.setItem('CONTRACT_VAT', '@Model.VAT');
sessionStorage.setItem('CONTRACT', '@Model.ContractId');
if(2==parseInt('@Session["Verify"]')){var verify=parseInt($("#ContractInfo").attr("verify"));2==verify?($("#ContractInfo").find(".panel-body").addClass("bg-danger"),$("#ContractInfo").find(".panel-body").css({border:"1px solid #bd0000"})):1==verify&&$.ajax({type:"POST",contentType:"application/json",url:'@Url.Action("SetContractColorChange", "ManagerContract")',data:"{ContractId:@Model.ContractId}",success:function(a){for(var t=a.split(","),e=0;e<t.length;e++)switch(t[e]){case"ClientId":$("#txtClientId").closest("div").addClass("has-error"),$("#txtClientId").addClass("bg-danger");break;case"ContractDate":$("#txtContractDate, #txtContractDateLite").closest("div").addClass("has-error"),$("#txtContractDate, #txtContractDateLite").addClass("bg-danger");break;case"ExpireDate":$("#txtExprireDate, #txtExprireDateLite").closest("div").addClass("has-error"),$("#txtExprireDate, #txtExprireDateLite").addClass("bg-danger");break;case"ContractStatus":$("#cboContractStatus").closest("div").addClass("has-error"),$("#cboContractStatus").addClass("bg-danger");break;case"SalerId":$("#txtSalerId").closest("div").addClass("has-error"),$("#txtSalerId").addClass("bg-danger");break;case"VAT":$("#txtVAT").closest("div").addClass("has-error"),$("#txtVAT").addClass("bg-danger");break;case"ContactClientId":$("#cboContactClient").closest("div").addClass("has-error"),$("#cboContactClient").addClass("bg-danger");break;case"PayDate":$("#txtPayExpireDate").closest("div").addClass("has-error"),$("#txtPayExpireDate").addClass("bg-danger");break;case"MaVungMien":$("#cboRegionSelector").closest("div").addClass("has-error"),$("#cboRegionSelector").addClass("bg-danger");break;case"Amount":$("#txtTotal, #txtTotalLite").closest("div").addClass("has-error"),$("#txtTotal, #txtTotalLite").addClass("bg-danger");break;case"SalerBookingId":$(".saler-booking-div").addClass("has-error")}}}),$("#btnExpand").trigger("click")}
$('#ajax_loading').removeAttr('style');
}
LoadTokenUserBoostrap()
});
Attempting to compress code using arrow functions gives the following error:
Unexpected token: punc ()) (line: 1, col: 9)
The code I am attempting to compress is this:
var e = () => {
document.body.classList.add("no-scroll");
}
Please could you add support for arrow functions? I am going to have to use another compressor in the meantime.
Environment: production ( https://jscompress.com/ )
Reproduces: always
It looks like let
and const
keywords are not handled and prevent the file from being minified.
Input:
let foo = 'bar';
Output:
Unexpected token: name (foo) (line: 1, col: 4)
Expected result:
let foo="bar";
The issue occurs in both copy-paste and file upload modes.
I enabled checkbox "ECMAScript 2022 (via babel-minify)" and get following error :
SyntaxError: unknown: Support for the experimental syntax 'classPrivateProperties' isn't currently enabled (2:3):
1 | class ClassWithPrivateField {
2 | #privateField;
| ^
3 | }
4 |
5 |
Add @babel/plugin-proposal-class-properties (https://git.io/vb4SL) to the 'plugins' section of your Babel config to enable transformation.
If you want to leave it as-is, add @babel/plugin-syntax-class-properties (https://git.io/vb4yQ) to the 'plugins' section to enable parsing.
More info on "#privateField" :
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Classes/Private_class_fields
The file to be compressed is quite large (1.52 MB) but I keep getting this error message (TypeError: unknown: Cannot read property 'referencePaths' of undefined) when I try to compress it on the website https://jscompress.com.
I've already searched the file thoroughly and there's nothing matching the search: referencePaths (or paths, or reference (and yes, I searched regardless of casing)).
Any reason why this happens?
Thanks for any responses to solve this problem.
I try to make bookmarklet, I don't need "
in output.
Uploading multiple javascript files doesn't work.
Steps to reproduce:
app.js is missing and lots of other js errors in the error console
This code is compressing successfully
var opacity_hide = 1;
for (var i = 1; i <= 10; i++){
var opacity_hide = (10-i)/10;
// var delaytest = 1;
}
But this code is not compressing , and prints error:
var opacity_hide = 1;
for (var i = 1; i <= 10; i++){
var opacity_hide = (10-i)/10;
var delaytest = 1;
}
Error:
File maintest.js: TypeError: unknown: setting getter-only property "inList"
It cause only if "ECMAScript 2019 (via babel-minify)" is checked
Hi! Would you please add a favicon?
The SSL Server Certificate for jscompress.com expired on August 29th, 2019
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.