Enhancing Google App Script performance and optimizing CSS styles for improved functionality

Greetings! I am reaching out in the hopes of tapping into your expertise and seeking assistance with a commission calculator project that I am currently working on using GoogleScript. Attached are the project requirements, as well as my GoogleSheet and the current GoogleScript code.

The main challenge lies in optimizing the output to meet specific criteria, and I believe that the insights, guidance, and support from the community could be incredibly valuable in achieving this goal.

If you could spare some time to review the documents and provide any suggestions, modifications, or improvements to the existing code, it would be greatly appreciated.

I am eager to benefit from the collective knowledge within this community and look forward to learning from all of you.

Thank you so much for your time and support. Here are the links to the GoogleSheet (GoogleSheet Link) and Document (Document Link).

cssgoogle-sheetsgoogle-apps-script

Answer №1

Upon my curiosity, I decided to review your project.

To improve efficiency, I recommend dividing the file into three separate files: one for HTML, one for CSS, and one for JavaScript, as demonstrated in this example.

Instead of making three server calls for redundant data retrieval using getData(poolId, empId), 

getEditableTableData(poolId, empId)
, and getRightTableData(poolId, empId), consider fetching all necessary data in a single call and then processing it on the client side for displaying in the appropriate tables.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is causing Visual Studio 2022 to flag the use of an unidentified CSS class property from Bootstrap?

I recently set up a new razor page web app template project in visual studio 2022. As I started adding some bootstrap CSS classes, here is the HTML snippet that I used: <form method="get"> <div class="form-group"> ...

csstwitter-bootstrapbootstrap-4

What is the best way to remove CSS styling from a select element?

My select element is displaying blank option values no matter what I do. The dropdown has the correct number of options, but they are all empty. Here's the HTML snippet: <label for="accountBrokerageName">Brokerage:</label> <se ...

htmljquerycss

Design a layout featuring an array of boxes in varied sizes

Is it possible to create a grid layout with 3 columns containing div boxes of varying heights, all populated with content extracted from a database? ...

htmlcss

Is there a way I can implement jQuery animation on my pop-up window?

I've successfully set up a basic popup using jQuery. When a button is clicked, it changes the 'display' property of a div from 'none' to 'block' in CSS and creates an overlay to darken the background. Take a look at my c ...

javascriptjqueryhtmlcss

Tips for arranging div elements in a grid-like matrix layout

I am facing a challenge in arranging multiple rectangular divs into a grid structure with 10 columns and 10 rows. The CSS styles for the top, bottom, left, or right positions must be in percentages to accommodate zoom in and out functionality without overl ...

javascriptjqueryhtmlcss

How can I align a group of four checkboxes in HTML?

Code for HTML <div id=checkbox> <div id=groupfour> <div id=groupone> <input type="checkbox" checked="checked" name="Mapmashup" value="Jan" id="EJan"> <label>Jan </label> < ...

htmlcss

Overflow due to cascading style sheets

THE ANSWER TO THIS QUESTION HAS BEEN PROVIDED In regards to this particular div that contains two unordered lists, I am seeking a solution where these lists can be positioned side by side instead of above or below each other. I have attempted various met ...

htmlcssmenucss-float

The navigation menu collapses upon itself when resizing the browser window

Every time I try to adjust the browser size, the navigation menu seems to collapse within itself, creating a strange effect. I can't figure out what's causing this issue. I've experimented with max-width and sometimes including the "wrapper ...

htmlcss

When utilizing table-cell, the padding will automatically increase within the <div>

After creating two tables using table,table-cell, I noticed that increasing padding on the first cell also results in an increase in padding on the second cell, and vice versa. How can this issue be resolved? .desc-one{ width: 100%; margin-bottom: 2 ...

htmlcss

Managing styles and scripts in Asp.Net MVC: A guide to efficient organization

Currently, I am utilizing asp.net mvc 2.0 in my projects and appreciate its design and functionality. However, I find that it lacks proper support for applications with a significant amount of styles and scripts. To address this issue, I implement areas, ...

javascriptasp.netcssasp.net-mvcdesign-patterns

The container is not adjusting to the screen size correctly and the flex-direction: row is not functioning as

Struggling with setting up a basic layout in Angular for my application. While I have experience with Angular, the actual HTML/CSS design is new to me. No matter what I try, I can't seem to get this container to take up the whole screen width. Variou ...

htmlcssangularflexbox

Combine and store downloaded stylesheets in the browser into a single file

My task involves transforming a website page along with all its external stylesheets into a single HTML file with inline CSS. This is not for usage in emails, but rather to incorporate styled sections of that page into another website's page. After so ...

javascripthtmlcss

Is it possible to incorporate HTML and CSS into Kivy and Python 3 development?

Currently in the process of creating a multi-touch kivy program using Python 3.52 on Linux. While Kivy is effective, I've encountered challenges with GUI development and experienced laggy animations. I've noticed that my program tends to slow do ...

pythonhtmlcssembeddedkivy

What is the best way to display a Bootstrap pop-up and then automatically hide it after a few seconds

Does anyone know how to display a Bootstrap popup when the page loads and automatically hide it after 3 seconds? I found an example online but I'm unsure how to adapt the code for my specific needs. <button type="button" class="btn btn-primary" da ...

javascripthtmlcsswebbootstrap-modal

The HTML modal closing button is unresponsive and the contents inside are misaligned, causing functionality issues

I've searched through similar questions, but none of the suggested solutions seem to work for my issue. The problem I'm facing is that the closing button on my modal isn't functioning properly and the content inside it is not aligning corre ...

htmlcssmodal-dialog

The downward trajectory of the Hamburger Menu is uncompromised, yet it refuses

Currently, I am utilizing Ruby on Rails 7 and Bootstrap 5. I encountered an issue with my hamburger menu functionality - it opens successfully but fails to close. Strangely, all other dropdowns work perfectly fine. Below is the snippet of the problematic c ...

cssbootstrap-5ruby-on-rails-7hotwire-rails

Do you wish to generate a chunk of text?

Is there a way for me to generate a basic block of content, like the "Unrest in the Middle East" section found on The Economist? I would be extremely grateful for any assistance. ...

phphtmlcssdrupaldrupal-blocks

Move the dropdown selection above all DIV elements

Check out this link: Make sure to select an option from the dropdown menu. Also, some of the options are hidden behind other elements. I noticed that if I target .join-form and remove overflow: hidden, the layout of the page becomes distorted. Can anyon ...

htmlcsstwitter-bootstrap

JavaScript Subscribe / Unsubscribe Button

I am trying to create a simple JavaScript program that allows users to like and dislike content. However, I am new to JavaScript and finding it a bit challenging. Basically, when the user clicks on the Follow button, the "countF" variable should increase ...

javascripthtmlcssarrayslinux

Ways to implement material-ui button design on an HTML-native button

I am using pure-react-carousel which provides me an unstyled HTML button (ButtonBack). I would like to customize its style using material-ui. Trying to nest buttons within buttons is considered not allowed. An approach that works is manually assigning th ...

javascriptcssreactjstypescriptmaterial-ui