I'm wondering is there a way to manage the browser cache and keep it as less as possible in Angular PWA apps.
Growing browser cache in IOS devices fills the cache limit in website data and the app stops working because of that!
Is there a specific configuration for service workers to achieve this?
My current configuration:
{
"index": "/",
"assetGroups": [{
"name": "app",
"installMode": "prefetch",
"resources": {
"files": [
"/*.css",
"/*.js"
]
}
}, {
"name": "assets",
"installMode": "lazy",
"updateMode": "prefetch",
"resources": {
"files": [
"/assets/**",
"/profiles/**",
"/*.(eot|svg|cur|webp|png|gif|otf|ttf|woff|woff2|ani)"
]
}
}],
"dataGroups": [{
"name": "api",
"version": 1,
"urls": ["/api/**"],
"cacheConfig": {
"strategy": "freshness",
"maxSize": 1,
"maxAge": "7d",
"timeout": "1s"
}
}]
}
I dont think you can stop the caching growing because as I can see right now you are caching everything include static resource and api caching
What you can do is to tell it not to cache your page, by sending the appropriate headers or using these meta tags:
<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>
Update remove this and you should be good. This is for API caching
"dataGroups": [{
"name": "api",
"version": 1,
"urls": ["/api/**"],
"cacheConfig": {
"strategy": "freshness",
"maxSize": 1,
"maxAge": "7d",
"timeout": "1s"
}
}]
Related
I'v been trying to create a connector in MS teams but I get this error: when I click save : "Unable to save "Top.legal" connector configuration. Please try again."
I did some reseach for the problem but all of them didn't match with my case
here is my manifest.json file
{
"$schema": "https://developer.microsoft.com/en-us/json-schemas/teams/v1.9/MicrosoftTeams.schema.json",
"manifestVersion": "1.9",
"id": "xxxxxx",
"version": "1.0.0",
"packageName": "com.Top.legal",
"developer": {
"name": "Developer",
"websiteUrl": "https://www.exemple.com/",
"privacyUrl": "https://www.exemple.com/",
"termsOfUseUrl": "https://www.exemple.com/"
},
"description": {
"full": "send adaptive cards",
"short": "top legal"
},
"icons": {
"outline": "outline_icon.png",
"color": "color_icon.png"
},
"connectors": [
{
"connectorId": "8e33a624-cf51-4e6d-87ec-b7eaecd98a80",
"scopes": ["team"],
"configurationUrl": "https://84127fa549f0.ngrok.io/connect"
}
],
"name": {
"full": "Top.legal",
"short": "Top.legal"
},
"permissions": ["identity", "messageTeamMembers"],
"accentColor": "#FFFFFF",
"validDomains": ["5b6a00e5f53f.ngrok.io"]
}
and you can find here my config.html file =>
<!DOCTYPE html><html><head><meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>Page Title</title>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<script src='https://statics.teams.microsoft.com/sdk/v1.2/js/MicrosoftTeams.min.js'</script</head><body>Copy your webhook URL from here to POST messages in this channel: <span id="url"></span><br><br>Don't forget to click on "Save" to activate your connector.<script>microsoftTeams.initialize();
microsoftTeams.settings.getSettings(s => {
document.getElementById("url").innerText = s.webhookUrl;
console.log(s);
});
microsoftTeams.settings.setSettings({
entityId: "sampleConn",
configName: "sampleConfig",
contentUrl: "https://84127fa549f0.ngrok.io/connect"
});
microsoftTeams.settings.setValidityState(true);
microsoftTeams.settings.registerOnSaveHandler((saveEvent) => {
saveEvent.notifySuccess();
});
</script></body></html>
thank you for your help
Add ngrok url in valid domains while registering connector in Connectors Developer Dashboard. Please follow this sample code.
My Angular applications static js files are in a nginx server which is hosted in a docker container. Installability works fine, and the data responses from the API requests are in the cached storage. When online - the API requests return 200 (from service worker) as below.
But when request is made to same api when offline it returns 504 (from Service Worker).
504 when offline
{
"$schema": "./node_modules/#angular/service-worker/config/schema.json",
"index": "/index.html",
"assetGroups": [{
"name": "app",
"installMode": "prefetch",
"resources": {
"files": [
"/favicon.ico",
"/index.html",
"/manifest.webmanifest",
"/*.css",
"/*.js"
]
}
}, {
"name": "assets",
"installMode": "lazy",
"updateMode": "lazy",
"resources": {
"files": [
"/assets/**",
"/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
]
}
}],
"dataGroups": [{
"name": "my-api",
"urls": [
"/**/MyService.svc*"
],
"cacheConfig": {
"strategy": "freshness",
"maxSize": 1000,
"maxAge": "7d",
"timeout": "5s"
}
}] }
I assume the path restrictions are correct as when i test using http server locally it works fine.
I'm building a custom SAPUI5 app which consists of a seven diagrams (sap.viz.ui5.controls.VizFrame) in the page's header content (nested inside a sap.suite.ui.commons.ChartContainer) and a grid table (sap.ui.table.Table) in the main content area. The data for the charts and the table is provided by an OData V2 Service and the app is running stand-alone on the latest version (1.81.0).
The problem is the long loading time of the app. It takes between 7 and 20 seconds. Is this common for a "more complex" app? I tried to find the bottleneck but everything looks fine. Many network requests are cached (they take 0ms), however, there is a slight delay in between them and I can't see why. Additionally, there is the following warning in the console, although I'm using the data-sap-async="true" in my index.html file:
[Deprecation] Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/. [syncXHRFix-dbg.js:211:15]
Code snippets of my index.html and manifest.json
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Loading - Customer Fact Sheet</title>
<script id="sap-ui-bootstrap"
src="resources/sap-ui-core.js"
data-sap-ui-theme="sap_fiori_3"
data-sap-ui-resourceroots='{"com.schott.fiori.customerfactsheet.customerfactsheet-fiori3": "./"}'
data-sap-ui-compatVersion="edge"
data-sap-ui-oninit="module:sap/ui/core/ComponentSupport"
data-sap-ui-async="true"
data-sap-ui-frameOptions="trusted">
</script>
<link href="https://www.schott.com/static/assets/gfx/favicon/SCHOTT_16.png" rel="shortcut icon" type="image/png" />
</head>
<body class="sapUiBody">
<div data-sap-ui-component data-name="com.schott.fiori.customerfactsheet.customerfactsheet-fiori3" data-id="container" data-settings='{"id" : "customerfactsheet-fiori3"}'></div>
</body>
</html>
{
"_version": "1.12.0",
"sap.app": {
"id": "com.schott.fiori.customerfactsheet.customerfactsheet-fiori3",
"type": "application",
"i18n": "i18n/i18n.properties",
"applicationVersion": {
"version": "1.0.0"
},
"title": "{{appTitle}}",
"description": "{{appDescription}}",
"sourceTemplate": {
"id": "servicecatalog.connectivityComponentForManifest",
"version": "0.0.0"
},
"dataSources": {
"YODATA_SD_CFS_MATRIX_SRV": {
"uri": "/sap/opu/odata/sap/YODATA_SD_CFS_MATRIX_SRV/",
"type": "OData",
"settings": {
"localUri": "localService/metadata.xml"
}
}
}
},
"sap.ui": {
"technology": "UI5",
"icons": {
"icon": "",
"favIcon": "",
"phone": "",
"phone#2": "",
"tablet": "",
"tablet#2": ""
},
"deviceTypes": {
"desktop": true,
"tablet": true,
"phone": true
}
},
"sap.ui5": {
"flexEnabled": false,
"rootView": {
"viewName": "com.schott.fiori.customerfactsheet.customerfactsheet-fiori3.view.Main",
"type": "XML",
"async": true,
"id": "Main"
},
"dependencies": {
"minUI5Version": "1.65.6",
"libs": {
"sap.ui.layout": {},
"sap.ui.core": {},
"sap.m": {}
}
},
"contentDensities": {
"compact": true,
"cozy": false
},
"models": {
"i18n": {
"type": "sap.ui.model.resource.ResourceModel",
"settings": {
"bundleName": "com.schott.fiori.customerfactsheet.customerfactsheet-fiori3.i18n.i18n"
}
},
"": {
"type": "sap.ui.model.odata.v2.ODataModel",
"settings": {
"defaultOperationMode": "Client",
"defaultBindingMode": "OneWay",
"defaultCountMode": "Request"
},
"dataSource": "YODATA_SD_CFS_MATRIX_SRV",
"preload": true
}
},
"resources": {
"css": [{
"uri": "css/style.css"
}]
},
"routing": {
"config": {
"routerClass": "sap.m.routing.Router",
"viewType": "XML",
"async": true,
"viewPath": "com.schott.fiori.customerfactsheet.customerfactsheet-fiori3.view",
"controlAggregation": "pages",
"controlId": "app",
"clearControlAggregation": false
},
"routes": [{
"name": "RouteMain",
"pattern": "RouteMain",
"target": ["TargetMain"]
}],
"targets": {
"TargetMain": {
"viewType": "XML",
"transition": "slide",
"clearControlAggregation": false,
"viewId": "Main",
"viewName": "Main"
}
}
}
},
"sap.platform.hcp": {
"uri": "webapp",
"_version": "1.1.0"
}
}
Screenshots of my network tab
As the Network tab shows, there are many modules loading sequentially one by one and many of them even via sync XHR. The most important task is to reduce sync XHRs as much as possible.
I see in the manifest.json that only a small number of libraries are declared. According to the Network tab, however, the app uses controls from other libs which aren't declared in the dependencies.
So it should be:
"sap.ui5": {
"dependencies": {
"libs": {
"sap.ui.core": {},
"sap.m": {},
"sap.ui.table": {},
"sap.f": {},
"sap.ui.unified": {},
"sap.ui.layout": {},
"sap.viz": {},
"sap.suite.ui.commons": {}
},
Some libs are required by other libs transitively (e.g. sap.ui.table requires sap.ui.unified).src You may then add "sap.ui.unified": { lazy: true } if that lib is not directly in use.
Preload thirdparty modules asynchronously beforehand that are usually loaded via loadSyncXHR.
If you inspect the Initiator column within the Network tab, you can detect more modules that are loaded via sync XHR. Adding those modules to the data-sap-ui-modules should avoid it:
<script id="sap-ui-bootstrap"
data-sap-ui-modules="sap/ui/thirdparty/datajs,sap/ui/thirdparty/require"
...>
The sap/ui/thirdparty/datajs is required by v2.ODataModel. The sap/ui/thirdparty/require module by the sap.viz library. Both modules are usually fetched via loadSyncXHR. The above snippet fixes it. You might find more such modules.
Overall, the above points should should already improve the initial loading time noticeably. For more performance guidelines, go through the Performance Checklist.
Other things to consider
I18n
In order to reduce the number of requests consider to drop the i18n-support altogether if the app targets only a certain group of people speaking the same language. Multiple requests for
i18n text bundles are not only costly in size but also blocking other requests while loading as they're also loaded via sync XHRs by default. There is a way to load them asynchronously and also specifying which locales the app supports, but that's for another topic.
OData Model
Consider to set the count mode to None if not required since $count calculations tend to be costly in the backend. Also the operation mode Client fetches all entities. Consider to lazy-load them instead.
For all aggregation bindings
"": {
"dataSource": "MyV2Source",
"settings": {
"defaultOperationMode": "Default",
"defaultCountMode": "None",
"defaultBindingMode": "TwoWay",
"preliminaryContext": true
},
"preload": true
},
About preliminaryContext: see Optimizing Dependent Bindings.
For a single aggregation binding
items: { // e.g.
path: '/MySet',
parameters: {
countMode: 'None',
operationMode: 'Client' | 'Default' | 'Server' (see API ref)
}
}
API reference: https://openui5.hana.ondemand.com/api/sap.ui.model.odata.v2.ODataListBinding
UI5 tooling
Before deploying the app, building the app via the following command should reduce the application size drastically:
ui5 build self-contained -a
From https://github.com/SAP/openui5-sample-app#option-2-self-contained-build
This is currently applicable to stand-alone apps only.
In Selenium IDE, I want to create a page via a REST API before commencing some performance tests. I've been using executeAsyncScript to do so, but including the entire script, including the embedded page source code (twice escaped), in the tests.side JSON file, is becoming somewhat laborious whenever an edit has to be made.
Is there some way of referencing an external file or something?
I still want to do the test setup in Selenium IDE, so please do not suggest using external tools (e.g. a bash script containing a curl command) on the test environment before running the test suite.
A simplified version of my .side file is included below. What I want to change is the unmanageable nature of the value at ["tests"][0]["commands"][1]["target"].
{
"id": "00000000-0000-0000-0000-000000000000",
"version": "2.0",
"name": "tests-tests",
"url": "http://prod:1312",
"tests": [{
"id": "00000000-0000-0000-0000-000000000001",
"name": "MakeTestPage",
"commands": [{
"id": "00000000-0000-0000-0000-000000000002",
"comment": "",
"command": "open",
"target": "instructions/hcf",
"targets": [],
"value": ""
}, {
"id": "00000000-0000-0000-0000-000000000003",
"comment": "",
"command": "executeAsyncScript",
"target" : "var data = \"<body><p id=\\\"help\\\">help</p>\\r\\n</body>\" /* et cetera */",
"targets" : [],
"value" : ""
}],
"suites": [{
"id": "00000000-0000-0000-0000-000000000004",
"name": "Default Suite",
"persistSession": false,
"parallel": false,
"timeout": 300,
"tests": []
}],
"urls": ["http://prod:1312/"],
"plugins": []
}
I have a workflow where I have audio content. I need to access for this content in other application (with javascript). I am trying with a GET method to this URL:
http://localhost:8086/alfresco/service/cmis/s/SpacesStore/i/1a7be6f8-0c50-4995-a211-1736642db06a/children?alf_ticket=TICKET_f9906d69befbc49668b92ddf372d62532a29ce7d
(In this URL, the id "1a7be6f8-0c50-4995-a211-1736642db06a" is the identificator of the package of the workflow task.)
But, the response is the next XML:
<?xml version="1.0" encoding="UTF-8"?>
<feed xmlns="http://www.w3.org/2005/Atom" xmlns:app="http://www.w3.org/2007/app" xmlns:cmisra="http://docs.oasis-open.org/ns/cmis/restatom/200908/" xmlns:cmis="http://docs.oasis-open.org/ns/cmis/core/200908/" xmlns:alf="http://www.alfresco.org" xmlns:opensearch="http://a9.com/-/spec/opensearch/1.1/">
<author><name>admin</name></author>
<generator version="4.2.0 (r56674-b4848)">Alfresco (Community)</generator>
<icon>http://localhost:8086/alfresco/images/logo/AlfrescoLogo16.ico</icon>
<id>urn:uuid:1a7be6f8-0c50-4995-a211-1736642db06a-children</id>
<link rel="service" href="http://localhost:8086/alfresco/service/cmis"/>
<link rel="self" href="http://localhost:8086/alfresco/service/cmis/s/SpacesStore/i/1a7be6f8-0c50-4995-a211-1736642db06a/children?alf_ticket=TICKET_f9906d69befbc49668b92ddf372d62532a29ce7d"/>
<link rel="via" href="http://localhost:8086/alfresco/service/cmis/s/workspace:SpacesStore/i/1a7be6f8-0c50-4995-a211-1736642db06a"/>
<link rel="up" href="http://localhost:8086/alfresco/service/cmis/s/workspace:SpacesStore/i/13dd8d00-4ccd-4894-87fc-0b055cf41a4b/children" type="application/atom+xml;type=feed"/>
<link rel="down" href="http://localhost:8086/alfresco/service/cmis/s/workspace:SpacesStore/i/1a7be6f8-0c50-4995-a211-1736642db06a/descendants" type="application/cmistree+xml"/>
<link rel="http://docs.oasis-open.org/ns/cmis/link/200908/foldertree" href="http://localhost:8086/alfresco/service/cmis/s/workspace:SpacesStore/i/1a7be6f8-0c50-4995-a211-1736642db06a/tree" type="application/atom+xml;type=feed"/>
<title>1a7be6f8-0c50-4995-a211-1736642db06a Children</title>
<updated>2015-05-27T11:18:13.600-04:00</updated>
<opensearch:totalResults>0</opensearch:totalResults>
<opensearch:startIndex>0</opensearch:startIndex>
<opensearch:itemsPerPage>-1</opensearch:itemsPerPage>
<cmisra:numItems>0</cmisra:numItems>
</feed>
I don't know how to use this XML for my purpose. I need to hear the content (mp3 audio file) and modify its properties in my custom application.
Also I am trying with the next URL (GET):
http://localhost:8086/alfresco/service/api/node/content/workspace/SpacesStore/1a7be6f8-0c50-4995-a211-1736642db06a
But the result is: Web Script Status 404 - Not Found
How to retrieve a content of a workflow? There is some RESTful URL for this ?
Thanks for any help.
Greetings,
Pablo.
Finally, I resolve my questions using other RESTful URL. So, the steps to retrieve a content of a workflow is the next:
1. I get the package ID (this is a folder node) of the task of workflow:
GET /alfresco/service/api/task-instances/activiti$taskID
{
"data":
{
"id": "activiti$taskID",
"url": "api\/task-instances\/activiti$taskID",
"name": "wf:taskName",
"title": "Task for this",
"description": "Hello World !",
"state": "IN_PROGRESS",
"path": "api\/workflow-paths\/activiti$workflowID",
"isPooled": false,
"isEditable": true,
"isReassignable": true,
"isClaimable": false,
"isReleasable": false,
"outcome": null,
"owner":
{
"userName": "admin",
"firstName": "Admin",
"lastName": "istrator"
},
"properties":
{
"bpm_percentComplete": 0,
"bpm_description": "Hello World !",
"bpm_hiddenTransitions": [],
"bpm_package":"workspace:\/\/SpacesStore\/1a7be6f8-0c50-4995-a211-1736642db06a",
...........................................................
}
So, the package ID is: 1a7be6f8-0c50-4995-a211-1736642db06a
2. With the package ID, I get the content which I need of this package:
GET /alfresco/service/slingshot/node/workspace/SpacesStore/1a7be6f8-0c50-4995-a211-1736642db06a
.............................................
"children": [
{
"name": {
"name": "{http:\/\/www.alfresco.org\/model\/content\/1.0}grabacion1.mp3",
"prefixedName": "cm:grabacion1.mp3"
},
"nodeRef": "workspace://SpacesStore/9ed7905d-7017-40e9-9514-93244b0a9a6a",
"type": {
"name": "{http:\/\/www.alfresco.org\/model\/content\/1.0}content",
"prefixedName": "cm:content"
},
"assocType": {
"name": "{http:\/\/www.alfresco.org\/model\/bpm\/1.0}packageContains",
"prefixedName": "bpm:packageContains"
},
"primary": false,
"index": 0
}
],
.............................................
So, the content ID is: 9ed7905d-7017-40e9-9514-93244b0a9a6a
3. Finally, I get the content which I need:
GET /alfresco/service/api/node/content/workspace/SpacesStore/9ed7905d-7017-40e9-9514-93244b0a9a6a
If you need access to the properties of the content, you can use the URL of the step two with the content ID (in this example: 9ed7905d-7017-40e9-9514-93244b0a9a6a).
Greetings :)