Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!


Removing code that is not needed.
New on LowEndTalk? Please Register and read our Community Rules.

All new Registrations are manually reviewed and approved, so a short delay after registration may occur before your account becomes active.

Removing code that is not needed.

armandorgarmandorg Member, Host Rep
edited November 2018 in Help

This is a topic for programmers and not related to hosting.

Let's say i have had a recent project [html,css,javascript,images..] and it is online. In that project there are many js files, img files, css... etc that are needed for the most pages.

Now i want to get just a single html file and i don't need the other pages from the project, however that page has css code, js code.. which is not needed and will reduce the performance of the website while loading.

Is there any way to automatically remove the code that are in files of .css/.js that were meant for the other pages and not this one.

Hopefully you did get it right, if not, i'll try again.

Thanked by 1uptime

Comments

  • It might not be what you are looking for, but to remove unused CSS , you can try this site : https://uncss-online.com/

    For Javascript, it should be lot more complex, since a tool would need to run the script, as a web browser would do, to eventually find the piece of code which is never executed. And, only if the page is not interactive.

  • kbapkbap Member
    edited November 2018

    The code inspection module of WebStorm might do the trick: https://www.jetbrains.com/help/webstorm/code-inspection.html

  • armandorgarmandorg Member, Host Rep

    @SteveMC said:
    It might not be what you are looking for, but to remove unused CSS , you can try this site : https://uncss-online.com/

    For Javascript, it should be lot more complex, since a tool would need to run the script, as a web browser would do, to eventually find the piece of code which is never executed. And, only if the page is not interactive.

    Looks perfect, though i'll be needing such a thing for javascript aswell. Seems to be pretty basic this one but works good for css only.

  • https://github.com/mishoo/UglifyJS2 has an option to remove dead_code. I use it as a Webpack plugin to transpile my JS project into two or three JS files. For CSS, I use https://github.com/webpack-contrib/extract-text-webpack-plugin

    It's worthwhile to setup a Webpack config file for your javascript projects.

  • jsgjsg Member, Resident Benchmarker

    There are almost certainly tools that could that. But for a single Html page it's probably not worth to learn how to use it, configure it, etc.

    Probably a much simpler approach is more effective. Like simply using your browsers networking inspector and simply see everything loaded by the Html page you are interested in.

  • PageSpeed maybe? If you want something easy and fast.

    You should start using build and task management tools if you haven't already. They are very productive and helpful with website performance.

  • Just never include the JS / CSS to begin with? I'm kinda missing the point here probably. If you don't want JS or CSS to be included in your HTML file, then simply don't include it in the head of your file. Unless you're using something like webpack, but in that case, just run separate builds and don't include it in the HTML page.

  • I agree with @jsg
    There are tools for it but to set them up is another thing. And they do not always work exactly like you want. For css most will do fine but js is another story. I would say you rather do it your own or if you can't ask somebody to do it. Depending on how big the project is - I guess it won't be that big since you want it as a single page/file - it should be pretty cheap. My best guess is to get some cheap freelancer to do it for you or even for free who knows.

  • armandorgarmandorg Member, Host Rep

    @blackjack4494 said:
    I agree with @jsg
    There are tools for it but to set them up is another thing. And they do not always work exactly like you want. For css most will do fine but js is another story. I would say you rather do it your own or if you can't ask somebody to do it. Depending on how big the project is - I guess it won't be that big since you want it as a single page/file - it should be pretty cheap. My best guess is to get some cheap freelancer to do it for you or even for free who knows.

    The project has more than 8 files of .css, 4-5 files of .js and around 30 html pages.

    I would think again before going and manually removing the code which is not needed.

  • just use NoScript and file->save as

    Thanked by 2armandorg eol
  • armandorgarmandorg Member, Host Rep
    edited November 2018

    @CyberMonday said:
    just use NoScript and file->save as

    Piss off : |

  • Going in manually for the JS would be your best bet. The .css is a lot easier to remove but the .js can be a little tricky for some of those scripts, personally they've ended up making more of a mess than if I had gone in and done it manually from the start. Just my two cents on this, hope you can find something that works for you.

  • jsgjsg Member, Resident Benchmarker
    edited November 2018

    @armandorg said:
    The project has more than 8 files of .css, 4-5 files of .js and around 30 html pages.

    I would think again before going and manually removing the code which is not needed.

    (a) which one is it then? I answered to the OP

    @armandorg said:
    Now i want to get just a single html file and i don't need the other pages from the project, however that page has css code, js code.. which is not needed and will reduce the performance of the website while loading.

    (b) wrong approach. The point isn't removing (presumably) not need files. The point is to find out which css, js, etc. files are needed by the Html file you want.

Sign In or Register to comment.