Can you build an Excel task pane add-in with Svelte? - excel-addins

I'm thinking about developing an Excel add-in as described here.
Would that be possible with Svelte - and do you know of any guides/help if yes?
I have looked through the video here, and I'm about worried about the usage of webpack.

Well... let's break it down
Is it possible?
Short answer: yes
Long answer: the documentation clearly states that Excel add-in still uses jQuery for logic manipulations. If your question was about Angular or react it would probably be a hard NO since those frameworks use an engine that should be included as part of solution. This kind of dependencies when dealing with plugins development are pretty hard to implement and maintain as a function of time so it's better to use very lightweight, non-core dependencies instead. Since you are asking about svelte - it is "compiled" into a bundle that contains pure code (based on your app logic). So - as long as your app rely on the load event sequence described in the docs - you are good to go.
Do you really need Webpack?
Short answer: no
Long answer: svelte can be deployed using rollup instead - which is more suitable for micro-applications (such as yours). So, if you feel that webpack (somehow) is blocking your work pipeline - just use svelete default configuration with rollup and you are ready to go
Your workflow
Create a very simple svelte app (my suggestion - try to take the example in the docs and implement it using svelte)
Test it locally (just verify it works)
Build it (you should ended up with 3 files - 1 html file in public directory and 2 other files in public/build directory - 1 js file and 1 css file (both called bundle)
Here's the tricky part - the html file does nothing - just loading the css and js files. In your case - you don't really need it
Change the bundle.css file to Home.css file
Change the bundle.js file to Home.js file and put your app inside the add-in main function
'use strict';
(function () {
Office.onReady(function() {
// Office is ready
YOUR SVELTE APP CODE SHOULD BE PLACED HERE
});
})();
Pack your add-in and test it
Technical notes
If Excel blocks the creation of new elements (using dynamic injection) - this approach will NOT work (since your entire app is generated by your js file)
Please refer to this article for more information about packing your app
Try to make your app as lightweight and small-size as possible just to avoid the risk of exceeding the limits allowed for add-ins

Related

Couldn't find a related Android.mk template on android source tree

I am reading the android platform-build docs with gnu makefile(Android.mk) from https://android.googlesource.com/platform/build/+/master/core/build-system.html.
Now I met an issue I didn't find a related template example?
<h3><a name="templates"/>How to add another component to the build - Android.mk templates</h3>
<p>You have a new library, a new app, or a new executable. For each of the
common types of modules, there is a corresponding file in the templates
directory. It will usually be enough to copy one of these, and fill in your
own values. Some of the more esoteric values are not included in the
templates, but are instead just documented here, as is the documentation
on using custom tools to generate files.</p>
<p>Mostly, you can just look for the TODO comments in the templates and do
what it says. Please remember to delete the TODO comments when you're done
to keep the files clean. The templates have minimal documentation in them,
because they're going to be copied, and when that gets stale, the copies just
won't get updated. So read on...</p>
<h4>Apps</h4>
<p>Use the <code>templates/apps</code> file.</p>
<p>This template is pretty self-explanitory. See the variables below for more
details.</p>
As sections mentioned above I assume there are somethings named 'templates' directory for
a library, apps ... But I couldn't find that in android source tree.
Could anyone enlighten me?
The examples are not located in a templates subfolder, but in the same directory as build-system.html:
binary.mk, shared_library.mk, java_library.mk, and many more.
Note: Android is switching from the Makefile-based build system to Soong. You might want to consider switching, too.

How to include only the Google PHP APIs that I need (just Google Spreadsheets)?

Summary: My simple website now successfully communicates with Google Spreadsheets, but the inconvenience of adding this Google Spreadsheets API is that deployments of my website (via deployhq.com) now take 50 minutes when they used to take 30 seconds!
Details:
I created a simple webpage using PHP that accepts parameters and then appends a new row of data to a Google Spreadsheet. Getting it working felt like a miracle because Google's documentation was so sparse and often outdated.
Following the example there and on Google's Github page, my composer.json file is:
{
"require": {
"google/apiclient": "^2.0"
}
}
Can I somehow avoid requiring all of those Google dependencies for all of their PHP APIs?
I'd love not to download all of the irrelevant Google API code that has nothing to do with Google Spreadsheets.
I think the massive amount of files is what is causing my deployments to take 50 minutes instead of 30 seconds.
My super basic webpage pretty much just uses the Google_Service_Sheets class and related classes. I want anything extraneous.
If you download a release of the client library it will include the core library and all of its dependencies, without the auto-generated classes. Then you can then download the Sheets API generated classes separately and add them to your project. Using composer is the preferred method, as it makes it easy to get updates later.
P.S. - There are ~4200 generated files downloaded with the library. That's not trivial, but any process that takes 50 minutes to copy those over likely has room for improvement.

TypoScript: Check if JS/CSS File is already included

anybody knows how to check if a js/css file is already included with typoscript?
Example
[Template_A.ts]
page.includeJS {
jsfile = fileadmin/Template/js/jquery-1.10.2.min.js
}
now if i got an extension with the same include e.g.
[Extension_A.ts]
page.includeJS {
jsfile = fileadmin/Template/js/jquery-1.10.2.min.js
}
Is there a way to prevent this kind of double code injection? Maybe i got another Template e.g. Template_B.ts where jquery is not included - than the Extension_A.ts has to include jquery by itself.
Kinldy
You can use the same key inside includeJS such it just gets overridden if you include the file twice.
Other than that you should put jQuery into includeJSlibs, such that it is loaded before the other JS files.
Other than that, the TS should be unique for each page. Therefore you always to make sure anyway that all resources are included in-order.
You should not include JS libs with the automatic extension TS setups. Use your documentation to tell the integrator what needs to be included and what not.
The various and independent inclusion of scripts by plugins and templates is one of the tricky points in TYPO3. As far as I know, this point cannot be managed at one single point.
There is a plugin "t3jquery" that offers to build, compress and share a common jQuery library. It also has a service to analyze other plugins for their dependencies. But this doesn't solve the problem in general, as many plugins don't check for libraries already loaded.
The most stable way is to remove all plugin's references to libraries manually in your TypoSkript. This gives you some simple additional TypoSkript lines. I use lines like these:
plugin.tx_imagecycle_pi1.file.jQueryLibrary >
plugin.tx_imagecycle_pi1.jQueryLibrary >
plugin.tx_multicontent_pi1.file.jQueryLibrary >
plugin.tx_multicontent_pi1.jQueryLibrary >
# Fluid
page.headerData.998 >
You can find the matching TypoSkript descriptors by searching for the library name in the TypoSkript browser or by greping in the plugin's source code. You will also need this if you wish to add libraries as part of content that was get by AJAX, thus separating the libs from the page content.
Here's a tut (in German): http://jweiland.net/typo3/typoscript/javascript-manuell-entfernen-oder-einbinden.html
Futher possibilities you can check:
Some plugins are written in good structure and offer to keep back their Javascript in the settings.
Some script inclusions may come rather from the static template but from a plugin, so don't forget to have a look there.

GWT Startup Sequence optimization

Reading the Goole 2010 IO pdf of : "Architecting for Performance with Google Web Toolkit", I found this approach to reduce startup time :
Better: 2 round trips:
First:
- Host Page
- Script URL
- Initial Data
Second:
- Compiled Script
It is not the Default GWT setup:
4 round trips
- Host page
- Selection Script
- Compiled Script
- Initial Data
My problem is that I do not how to do to acheive the "2 round trip solution". Could you help me ?
It's actually rather easy:
inline the selection script in your page (can be done with a special GWT Linker, or using a JSP include directive for instance –I've successfully been using the latter, much easier– and add a <meta name='moduleName::gwt:property' content='baseUrl=moduleName/'> to tell the inlined selection script where to find the compiled permutation.
Technically, you could go even farther and replace the selection script with server-side content negotiation. I believe Google does that (e.g. for Google Groups) but it's a bit harder (made way simpler with modularization of the CrossSiteIframeLinker, but still not that easy).
for the initial data, see https://developers.google.com/web-toolkit/articles/dynamic_host_page and http://jectbd.com/?p=1174 (I've been using AutoBeans to pass user information and application settings to the GWT app)

How could I include a plugin system for my Dart app?

I have a Qt application containing a Webkit module and using Dart (compiled to JS). It's like a bare-bones browser written in Qt. The application basically replaces certain text on the webpage with different text. I want users to be able to make their own Dart files to replace their own text with their own different text.
Any recommendations for approaches to creating a plugin system?
I think that this question needs a little clarification: are you asking about using Dart for scripting Qt applications (where Dart plays the role of a scripting language), or are you asking about a plugin system for Dart application that is compiled to JS and used in a Qt application, probably via QtScript (in which case, the role of a scripting language is played by JavaScript)?
I presume that it is the latter variant (and I don't know enough about Qt to be able to answer about the former variant anyway).
Let's assume that all plugins for the Dart application are available at the build time of that Qt application, so that you don't need to compile Dart to JS dynamically. Then, if you compile a Dart script, resulting JS will include all necessary code from its #imports. All you need is to create a proper script that imports all plugins and calls them (importing isn't enough, as dead code will be eliminated).
Maybe an example will be more instructive. Let's say that you want to allow plugins to do some work on a web page. One way you might structure it is that every plugin will be a separate #library with a top-level function of a well known name (say doWork). Example of a plugin:
// my_awesome_plugin.dart
#library('My Awesome Plugin')
doWork(page) {
page.replaceAll('JavaScript is great', 'Dart is great');
}
You can have as many plugins of this nature as you wish. Then, you would (at the build time) generate a following simple main script in Dart:
// main.dart
// these lines are automatically generated -- for each plugin file,
// one #import with unique prefix
#import('my_awesome_plugin.dart', prefix: 'plugin1');
#import('another_plugin.dart', prefix: 'plugin2');
main() {
var page = ...; // provided externally, from your Qt app
// and these lines are automatically generated too -- for each plugin,
// call the doWork function (via the prefix)
plugin1.doWork(page);
plugin2.doWork(page);
}
Then, if you compile main.dart to JavaScript, it will include all those plugins.
There are other possibilities to structure the plugin system: each plugin could be a class implementing a specific interface (or inheriting from a specific base class), but the general approach would be the same. At least the approach that I would recommend -- making each plugin a separate library.
You probably don't like the step with generating the main script automatically, and I don't like it either. But currently, Dart only allows one way to dynamically load new code: spawning new isolates. I'm not sure how (or even if) that would work in QtScript, because isolates are implemented as web workers when compiled to JavaScript, so I won't discuss this here.
Things will get more complicated if you want to support compiling Dart scripts at the runtime of your Qt application, but I think that I'm already guessing too much about your project and I might be writing about something you don't really need. So I'll finish it like this for now.