Our release bundles are kinda huge (~50MB) and the clients take approx. 1-2 mins to download the update from codepush.
We're mostly just updating the js bundles, is there a way to just delta update the js bundle without re-downloading all image assets?
I've read from here that the server performs files diff, but it doesn't seem to work on my case: Logging RemotePackage.packageSize from checkForUpdate on clients shows the exact size of JS bundle + image assets, despite the fact that I've only changed the JS code.
Is there something I can do about this?
The CodePush backend should only serve the full contents up to the point it finishes creating a diff zip. On the backend your package is downloaded, extracted and analyzed for files that are different. Any new/updated/removed files are reconciled, put into another zip and shipped back up to the backend so users get served that instead of the original one you release. If you are seeing the full download, it's either because the backend is still working to process the diffs or there are differences inside your bundle.
I would try to do a release, wait 10 minutes and check to see if it is still downloading the full bundle. If it does, it'd be best to contact support for a deeper dive. As far as I can tell bundle's are processing correctly with next to no errors and running a quick test myself produced the correct results for me.
Related
I have developed a vue application and did run npm run build
After that I uploaded the content in the dist file to my webpage but it returned a blank page.
Since I did this for testing I uploaded it to a folder in my public_html/mypage.com/vueapplication To get all the paths right I added a vue.config.js with this content:
// vue.config.js
module.exports = {
publicPath: '/vueapplication/'
}
The application now works but I wounder however:
how do I best publish/upload the application to my site? Just by simply dragging the content inte the right folder?
how can I best maintain my site? Do I need to build again and upload, overwriting my files when everytime I make an update on my site?
And what is the difference between build and deploy your application?
Drag and dropping your code should work. But as your app grows you may want to look into automating this. For instance if you use an S3 bucket you can use the aws cli to automate the upload.
Yes, you should overwrite your deploy folder(s). You need to also take care of deploying different binary files, that have the same name. An example is if you have a global css file (main.css for instance). The file will probably change content between deployments, but keep the same name. Browsers may cache the file so users that downloaded older versions of the file will not use the new one. There are different techniques to handle this, but if you use webpack, it uses cache busting techniques and you should be fine.
Build is the process of transforming source code into an artifact(s). Exactly what this means differs from language to language, platform to platform. In the vuejs world this usually means a couple of js files, a couple of css files and some assets.
Deploying means taking the output of a build and making it available to your users. Again this differs from project to project. In the vuejs world this usually means taking the artifacts from the build and uploading them to an http enabled web server.
So here's a question. I'm new to Sylius, and am working on some simple CSS updates. I have a local copy of Sylius running with the built-in webserver: server:run. I also have a development server on Digital Ocean, which runs an (almost) identical copy of Sylius, aside from the configs of course.
Something strange is happening with my CSS update, however. I made a change to .navbar-brand within web/assets/compiled/backend_backend_4.css.
This change showed up immediately on my local. On the development server, however, when pulling down the change (git), and verifying that it now exists in that file, the change doesn't seem to propegate. It's effects aren't shown, inspecting the stylesheet doesn't show them, and furthermore viewing the css file sourcecode directly in the browser does not show the change. But on the filesystem it's definitely there.
I've tried clearing the cache, to no avail.
I also checked the assetic value in both config_dev.yml files, and verified they are both set to use_controller: true
Even still, I tried dumping assetic, to no avail.
So I'm wondering what's going on. Additionally, I realize that I probably shouldn't edit CSS files within a folder called 'compiled'. I'm sure there's a way to do that using a compiler, but I'm not yet familiar with the process and am just making minor changes and learning about caching so far.
Yes you are right you shouldn't be editing the compiled files.
You should edit the source files, then run gulp
or on my system i have to explicitly run npm run gulp
I've documented the solution that worked for me here. It didn't involve Gulp at all, but instead uses Assetic:
Assets need to be installed as hard copies first (I'm not quite sure
what this does exactly, but it seems like an important step because
it copies a lot of assets to places. Documentation was unhelpful but
it was suggested on Stack Overflow somewhere.):
app/console assets:install web
Assets should be edited in web/bundles/[bundle-here]/css or js. This
is frequently within syliusweb if it has to do with page styles /
layouts.
Hint: These assets are referred to in files such as
src/Sylius/Bundle/Resources/views/Backend/layout.html.twig (see the
opening:
(% stylesheets
tag, or search universally for this tag).
Within this tag, you'll see that stylesheets have an output to the compiled folder, but also list the
bundles where they pull their original css from. You should edit one of the source css files, if you'd like your changes to end up in the destination css.
After editing assets, dump assetic:
php app/console assetic:dump
Note - it is also possible to set an assetic watcher on these assets
(google to find out how, think it's a -w flag somewhere), but this is
said to only work in development mode, as it should.
After dumping assetic, the assets from the source bundles compile into their assets/compiled versions, usually combining multiple stylesheets. You should now see your asset refresh!
'import {ComponentHere} from "angular2"', this one hits the server with so may calls for getting all the required file. Is there any way to decrease the number of calls to server?
//localhost:9739/node_modules/#angular/common/src/directives/core_directives.js.
//localhost:9739/node_modules/#angular/common/src/pipes/uppercase_pipe.js".
//localhost:9739/node_modules/#angular/common/src/forms/directives/control_container.js".
etc..
Consider using a WebPack (https://angular.io/docs/ts/latest/guide/webpack.html) it normally will decreased the number of files sended to client (but they will be obviously bigger)
You can use "SystemJS Builder" (https://github.com/systemjs/builder) and integrate it into something like Gulp to make it part of your build process for bundles. You give it an entry point (your app) and it then looks at your dependency tree to build your bundle(s).
When your bundle is used, systemjs will import from your bundle instead of every little js file. When I tested with angular2, I had over 700 files downloaded in DEV and only 35 in PROD when using the bundle.
I'm in the process of upgrading a 3.0 Rails App to 3.1.4 including the Asset Pipeline.
I'm on Heroku, so I'm I have this in my application.rb
config.assets.initialize_on_precompile = false
I noticed that when I run:
bundle exec rake assets:precompile
it creates files in a public/assets directory (even though my assets are in app/assets already).
For example, it creates files like application-72b2779565ba79101724d7356ce7d2ee, as well as replicating the images I have in app/assets.
My questions are:
(1) should be uploading these files to my production server?
(2) if I'm suppose to be uploading these, am I suppose to update each application-xxxxxxxx or only the latest one?
To your first question: Heroku will not allow you to modify the filesystem. So your assertion is correct- You will need to pre-compile the asset pipeline before you send it up to Heroku, so that it can be utilized in your production environment.
And the latter: You'll want to make sure you have the latest compilation. Any others wont be used. The "xxxxxxx" portion is to make sure that your users have the latest and greatest version of your assets. It's a way of versioning what the browser gets, and making sure they're not caching a bad copy of the JavaScript, when you want to set up their cache to hold on to the JS and CSS files as long as they can, instead of constantly getting it from your web server.
Take my Heroku comments with a slight grain of salt, as I have not deployed to Heroku before. I just know how their system works to some degree.
Rails 3.1 loads pages terribly slow in development. It's processing them through the pipeline, one at a time, and takes way too long.
Is it possible to precompile my assets (which I'm not testing right now, so static files are fine) and have Rails not be responsible for serving them? Would that make things faster?
Update: Got a solution.
Richard Hulse has the correct answer to this question. rake assets:precompile will prebuild assets so they are served directly, without the asset pipeline.
But Frexuz's answer solves the problem of slow loading I've been having. Loading the Rails-dev-tweaks gem makes page loading in development markedly faster.
I had the same problem! It could take from 2-4 seconds extra to load a page because of the assets.
Take a look here (a gem): Rails 3.1 is very slow in development-mode because of assets, what to do?
This made serving assets almost instant (server console says 1ms per asset), using the asset pipeline normally.
Yes.
You can run the precompile task (in 3.1.1) and it will just work - the precompile task will give you assets without fingerprints as well as with, which is what you need in development mode. (Fingerprints are not added in dev mode).
Beware that you don't commit these to source control though.
What is more of a concern is the slowness. I have 4 stylesheets and 15 javascript files in my manifests, and it is only a bit slow on the first request.
What do you see in your logs when the assets are accessed? You should be able to see them being compiled on the first hit and each subsequent request should be a 304 not modified.
Also, do your config settings for dev match those in the asset pipeline guide? If you were compressing in dev mode with lots of files, this could be a source of slowness.