How to serve updatable Javascript files from a cdn - javascript

So here is the problematic.
I work for a company that generate customizable javascript files for each clients. Each client has to include the script on their product pages. The client can modify the configuration of the script at anytime.
What we are doing now is that we are managing all that internally but i was wondering if it was possible to serve those file from a cdn knowing that we must be able to modifify the files on the cdn when a client modify his configuration, and that the changes must take effect immediately.

do you have control over the save action? if so you could version the file on save and keep track of the latest version. then you can use it in your page builder and load the page: file.js?v= instead of just loading file.js directly.

Related

Load CSS and JS files if newer version exists on server

I have an Web site written by ASP.NET . JS and CSS files are cached by client browsers default. Is there a way, I want to browser cache js and css first, but I want to browser download and cache if newer js and css files. It may be possible , Control date modified.
I make change into head tag like ‘myscript.js?v=300’ , at this time browser load js everytime. I want to browser load js only once if files are newer.
Caching is based on cache related HTTP header response from your server. You need a bundler like this, webpack or browsify. Why you say not in practice while most bundler can generate different filename on every build. That is because browser maintain cache based on filename and the HTTP header, leaving only this two options for you to invalidate the cache. Try hard reload during your development.

Failed to load large JavaScript file ExpressJS after uglifying

All my scripts are compressed and minified used uglifyJS:
The size of this file "app.min.js" is 982.1KB however when I tried to run the node server and open the app in the browser It's stopped in 502kB
and after some while
I don't know what happened there, Is there any limitation on Javascript file '502kB' ?
what I miss
I think this article may help you, it is all about nodejs server serving static content, so nginx is recommended to do this purpose.
If you have to use nodejs server then you should make all files smaller in terms of size, no need for example to minimize libraries files as jquery since it is already minimized, scripts should be minimized only, you can even minimize all libs files into one javascript file called libs.min.js as example and the rest of your scripts in another file called script.min.js.

Not able to see changes to UI files while using Websphere Liberty Profile through Eclipse on Mac

Within WebSphere Application Server Liberty Profile Guide for Developers pdf in section 1.4 (Frictionless application development), it mentions:
By default, the Liberty profile will monitor deployed applications for changes.
Updates to static files (HTML, CSS, or JavaScript) or JSP files are detected and
served immediately. Changes to servlet classes cause an automatic restart of
the application.
I am not deploying via dropins folder. I have a configured server.xml file within Eclipse
<application location="/Users/path/my_application.ear" type="ear"></application>
I am not able to make any changes to my source UI files and see updates on WebSphere.
I am also not able to find a particular js file deployed anywhere, so it seems the *.ear file is not expanded, so I could edit the file directly on the server.
The only way I can see changes to my UI files is to make the changes to the source files and rebuild the ear file.
I feel like I am not creating a proper mapping to my source files and/or perhaps the Liberty profile on Mac doesn't explode the ear files so that I can edit the deployed UI files.
Thoughts?
If you want to have automatic updates of your files on the server, the best way is to use Eclipse to deploy the project to the server using "Add Remove" option on the server. This configures server.xml to point to your expanded app in the workspace. As result any changes to the files in the workspace are visible and detectable by the server.
If you configured your server.xml with path to the ear, it will monitor only for ear changes. And since your UI files are in totally different place, changes are not detected unless you rebuild your ear.
For deployment options to Liberty see the following links:
Adding and running an application on the Liberty profile by using developer tools
Deploying applications to the Liberty profile
It is possible to indicate path to an already deployed application, in my case it's a web application:
<webApplication location="\programs\wlp\app1_war" name="app1" contextRoot="app1">
<classloader delegation="parentLast"/>
</webApplication>
Changes in some scripts will be loaded automatically, but java classes are loaded by class loader when server starts or when app is redeployed.
See classLoader and classloaderContext, maybe there is a way to make class loader to reload classes at change:
https://www.ibm.com/support/knowledgecenter/SSD28V_8.5.5/com.ibm.websphere.wlp.core.doc/autodita/rwlp_metatype_core.html?view=kc#mtFile17

Add entire folder of JavaScript files to HTML5 App Cache

I have a huge set of JavaScript files that need to be added to the App cache. Is it possible to add an entire folder(JS folder) in the Manifest. Else, I'll have to manually add those JS files to the manifest.
Your manifest file doesn't need to be a static file. Just write some server side code to generate a manifest based on the files in the folder.
As Maurice has pointed out, you can generate the file dynamically.
Or better still, have a background task do the work when the contents of the folder changes.
Node.js is good for this if you are already familiar with JS and have control over the server so that it can be installed. Node comes with capabilities for watching files and folders & there are a number of libraries available to make the job simple.
One key issue to watch out for though is the combined size of the files. Many browsers that support HTML5 offline use, put strict limits on the amount of data you can store offline. Typically the default limit is 5MB.

How to call CSS and JS from a sub-domain - to make loading faster in Magento

When calling css and js files from a sub-domain, what would be the correct way to do this in Magento?
First, make sure the sub-domain resolves to the same folder as the rest of Magento. So a file, "http://www.example.com/file" will appear exactly the same as "http://static.example.com/file".
Then, in Magento's admin, go to System > Configuration > Web > Unsecure and change {{unsecure_base_url}} to your new sub domain (eg. "http://static.example.com/") for the Skin, Media and JavaScript options. Repeat for the "Secure" section too.
Edit:
I just remembered that for secure sub-domains you either need a wildcard certificate or an additional certificate for the sub-domain installed. It might be simpler to skip the "Secure" section because of this, most pages will not be served as secure so the inconvenience is minimal.
Also I've had problems with the image upload for products when using sub-domains, you can get around this with No Flash Uploader.
Just to add to that, it's recommended to set up static files on a different server running Nginx (or other optimized server, not Apache). If you are using separate servers you should share image folder via NFS (export on static files server, mount on all web nodes) so image upload works correctly.

Categories

Resources